TypeScript类型挑战:实现内置的Omit实用类型

news2024/11/18 11:35:35

掌握 TypeScript Omit 泛型,一起完成 Type 挑战,巩固 TypeScript 知识。

为了帮助读者更好地巩固 TypeScript 的知识,我从 Github 上的 type-challenges 库中选择了几十个挑战,与您一起完成类型挑战。


挑战
 

实现内置的  Omit<T, K>  泛型。通过从  T  中挑选所有属性,然后删除  K  来构造一个类型。

例如:

interface Todo {  title: string  description: string  completed: boolean}
type TodoPreview = MyOmit<Todo, 'description' | 'title'>
const todo: TodoPreview = {  completed: false,}

解决方案
 

我们的类型挑战是实现内置的  Omit<Type,Keys> 泛型,所以让我们首先理解  Omit<Type,Keys>  泛型的作用。

Omit<Type,Keys>

通过从  Type  中选择所有属性,然后删除  Keys  (字符串字面量或字符串字面量的并集),构造一个类型。

对于 TypeScript 的  Omit  泛型,它的作用是将现有的对象类型转换为新的对象类型。

为了实现上述类型转换,我们需要遍历除 Keys 以外的所有类型并返回新的对象类型,为此,我们需要使用 TypeScript 提供的映射类型。

映射类型
 

映射类型的语法如下:

其中 P in K 类似于 JavaScript 中的  for...in  语句,用于遍历类型 K 中的所有类型,而 T 类型变量用于表示 TypeScript 中的任何类型。

在介绍相关知识之后,让我们定义一个  MyOmit  泛型。

type MyOmit<T, K extends keyof any> = {  [P in Exclude<keyof T, K>]: T[P]}

在上面的代码中, T  和  K  被称为类型参数。 keyof  操作符用于获取一个类型中的所有键,其返回类型是一个联合类型。如果  keyof  操作对象类型,则其功能类似于  Object.keys  方法。

而 K extends keyof any 是一个泛型约束,用于约束类型参数 K 对应的实际类型是联合类型( string | number | symbol )的子类型, T[P] 用于获取T类型中P属性对应的类型,其中类型变量P的值在遍历过程中会不断变化。

 Exclude  泛型是 TypeScript 中的一个内置实用类型,它的角色是通过从  UnionType  中排除所有可赋值给  ExcludedMembers  的联合成员来构造一个类型。

事实上, Exclude  泛型的实现并不复杂,它在内部使用了条件类型。如果您对条件类型还不熟悉,可以阅读以下文章:

像专家一样使用TypeScript条件类型

/** * Exclude from T those types that are assignable to U. * typescript/lib/lib.es5.d.ts */type Exclude<T, U> = T extends U ? never : T;

为了更好地理解  Exclude  泛型,让我们来看看它是如何工作的:

完整的代码

最后,让我们看一下完整的代码:

interface Todo {  title: string;  description: string;  completed: boolean;}
type MyOmit<T, K extends keyof any> = {  [P in Exclude<keyof T, K>]: T[P];};
type TodoPreview = MyOmit<Todo, "description" | "title">;const todo: TodoPreview = {  completed: false,};

这个挑战涉及到的主要知识是 TypeScript 的映射类型,如果你想了解更多关于映射类型的信息,可以阅读以下文章:

像专家一样使用TypeScript映射类型

除了上面的实现,我们还可以使用  Pick  泛型来实现  MyOmit  泛型:

type MyOmit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;

 欢迎关注公众号:文本魔术,了解更多

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1376021.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

分布式系统架构设计之分布式消息队列的水平扩展性、安全可用性以及监控与调优

一、分布式消息队列的水平扩展 随着业务的快速发展和数据的不断增长&#xff0c;单一的消息队列服务器往往难以满足高并发、高可用和高吞吐量的需求&#xff0c;因此&#xff0c;如何实现消息队列的水平扩展成为了一个重要的问题。这部分我将从分区、副本、负载均衡等关键概念…

影响eCPM的因素有哪些?如何提升eCPM?

eCPM&#xff08;千次展示有效收益&#xff09;直接关系广告变现收益的高低&#xff0c;是开发者们最关心的数据之一。要想优化提升eCPM&#xff0c;首先要了解哪些主要因素影响eCPM&#xff0c;再针对性优化广告库存&#xff0c;提高变现收益。 https://www.shenshiads.com …

线性回归实例

1、线性回归&#xff08;linear Regression&#xff09;和逻辑回归&#xff08;logistic Regression&#xff09;的区别 线性回归主要是用来拟合数据&#xff0c;逻辑回归主要是用来区分数据&#xff0c;找到决策边界。 线性回归的代价函数常用平方误差函数&#xff0c;逻辑回…

java每日一题——打印100以内个位和十位相同,尾数为1,3,5,7的数字

前言&#xff1a; 打好基础&#xff0c;daydayup! 题目&#xff1a;打印100以内个位和十位相同&#xff0c;尾数为1,3,5,7的数字 思路&#xff1a;1&#xff0c;个位通过对10求余数可求出1&#xff0c;3&#xff0c;5&#xff0c;7&#xff1b; 2&#xff0c;十位可通过先除10…

【Unity】【Pico】【VR开发】为何PICO打包后真机运行闪退

【背景】 设置步骤&#xff0c;项目配置都没问题&#xff0c;Build也成功&#xff0c;Unity版本是符合要求的2022LTS版本&#xff0c;但是一在真机上运行就闪退。 【分析】 由于并没有开版权验证&#xff0c;而且闪退后也并没有弹框说版权问题&#xff0c;所以还是怀疑环境有…

软件测试|Python成员运算符:使用方法与元素检查

简介 Python是一种功能强大的编程语言&#xff0c;提供了许多方便的工具来处理数据和集合。其中之一就是成员运算符&#xff0c;它允许我们在集合中检查特定元素的存在。在本文中&#xff0c;我们将深入探讨Python中的成员运算符&#xff0c;以及如何使用它来进行元素检查。 …

pyside6 捕捉主窗口关闭后,进行释放相关的资源

import sys from PySide6 import QtGui from PySide6.QtWidgets import QWidget,QApplication,QMessageBoxclass Message(QWidget):def __init__(self):# 如果希望窗口内嵌于其他部件&#xff0c;可添加parent参数super(Message, self).__init__()# 调用初始化方法self.initUI(…

使用Sqoop将数据导入Hadoop的详细教程

在大数据处理中&#xff0c;Sqoop是一个强大的工具&#xff0c;它可以将关系型数据库中的数据导入到Hadoop生态系统中&#xff0c;以便进行进一步的分析和处理。本文将提供一个详细的教程&#xff0c;以帮助大家了解如何使用Sqoop将数据导入Hadoop。 准备工作 在开始之前&…

【uniapp】新课uniapp零基础入门到项目打包(微信小程序/H5/vue/安卓apk)全掌握

一、uniapp和HBuilderX介绍 uni-app官方网站&#xff1a;https://uniapp.dcloud.net.cn/ 为什么要学习uniapp&#xff1f; 1、一套代码可以打包到不同的应用平台&#xff1b;一套代码编到十几个平台&#xff0c;这不是梦想。眼见为实&#xff0c;扫描以下二维码&#xff0c;…

uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -用户投票实现

锋哥原创的uniapp微信小程序投票系统实战&#xff1a; uniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2vue3.2element plus ) ( 火爆连载更新中... )共计21条视频…

爬虫利器一览

前言 爬虫&#xff08;英文&#xff1a;spider&#xff09;&#xff0c;可以理解为简单的机器人&#xff0c;如此一个“不为名利而活&#xff0c;只为数据而生&#xff0c;目标单纯&#xff0c;能量充沛&#xff0c;不怕日晒雨淋&#xff0c;不惧寒冬酷暑”的家伙&#xff0c;…

[嵌入式软件][入门篇] 搭建在线仿真平台(STM32)

文章目录 一、注册平台二、创建首个项目三、硬件介绍 一、注册平台 进入官方&#xff0c;进行注册&#xff1a; 在线仿真地址 二、创建首个项目 ① 新建项目 ② 搭建一个电路 ③ 用STM32F103搭建一个简单电路 ④ 进入编码界面 三、硬件介绍 红框是必看文档&#xff…

【RT-DETR有效改进】带你分析如何确定改进的基础模型,解决模型无法收敛精度很差的问题(ResNet官方一比一复现)

一、本文介绍 Hello&#xff0c;各位读者&#xff0c;距离第一天发RT-DETR的博客已经过去了接近两个月&#xff0c;这段时间里我深入的研究了一下RT-DETR在ultralytics仓库的使用&#xff0c;旨在为大家解决为什么用v8的仓库训练的时候模型不收敛&#xff0c;精度差的离谱的问…

Maven 依赖管理项目构建工具 教程

Maven依赖管理项目构建工具 此文档为 尚硅谷 B站maven视频学习文档&#xff0c;由官方文档搬运而来&#xff0c;仅用来当作学习笔记用途&#xff0c;侵删。 另&#xff1a;原maven教程短而精&#xff0c;值得推荐&#xff0c;下附教程链接。 atguigu 23年Maven教程 目录 文章目…

Skywalking UI页面中操作的各种实用功能汇总

刚刚接触skywalking不久&#xff0c;在这里总结一下在UI页面中操作的各种实用功能&#xff0c;随着使用的不断深入&#xff0c;我也会对文章进行持续补充。 本文skywalking 的ui入口是官方demo &#xff0c;版本是10.0.0-SNAPSHOT-593bd05 http://demo.skywalking.apache.org…

【GO语言依赖】Go语言依赖管理简述

在运行环境中&#xff0c;遭遇报错&#xff0c;显示找不到函数 经过研究后发现需要进行依赖管理&#xff0c;进行如下操作后解决&#xff1a; 起源 最早的时候&#xff0c;Go所依赖的所有的第三方库都放在GOPATH这个目录下面。这就导致了同一个库只能保存一个版本的代码。如…

vite 搭建vue3 TS项目初始框架

目录 仓库地址&#xff1a; 一.搭建项目 1.安装 Vite&#xff1a; 2.创建 Vue 3 项目&#xff1a; 3.进入项目目录&#xff1a; 4.安装依赖&#xff1a; 5.运行项目&#xff1a; 6.流程实操 二.修改项目结构&#xff0c;显示自定义的页面 1.整理静态样式文件 1.1.在 sr…

安泰电子功率放大器在设计电路时应该注意什么

在设计功率放大器电路时&#xff0c;有几个重要的因素需要特别注意。这些因素包括功率放大器的线性度、效率、稳定性、保护功能和适当的散热设计。下面将详细介绍每个因素&#xff0c;并说明在设计功率放大器电路时应该注意的要点。 线性度&#xff1a; 功率放大器的线性度是指…

OpenHarmony4.0Release系统应用常见问题FAQ

前言 自OpenHarmony4.0Release发布之后&#xff0c;许多小伙伴使用了配套的系统应用源码以及IDE作为基线开发&#xff0c;也遇到了各种各样的问题&#xff0c;这篇文档主要收录了比较常见的一些问题解答。 FAQ 系统应用源码在哪 目前OpenHarmony系统应用分为3种模式&#x…

Realm Management Extension领域管理扩展之调试跟踪分析

现代 Arm 系统包含大量功能以支持调试和性能分析。我们必须确保这些功能不能被用于危害系统安全。Arm 架构中,搭载 RME,提供了控制来限制系统的哪些部分可以进行调试。 本节假定读者熟悉 Armv9-A 中的基本功能,并总结了 RME 引入的变化。 外部调试 外部调试是指通过位于处…