TS系列之工具类型Partial、Required、Pick、Record详解,示例

news2024/12/21 16:54:30

TS系列之工具类型Partial、Required、Pick、Record详解,示例

文章目录

  • 前言
  • 一、Partial<Type>
  • 二、Required<Type>
  • 三、Pick<Type, Keys>
  • 四、Record<Keys, Type>
  • 总结


前言

本片文章主要利用上一篇所学的keyof做一个延申与扩展的学习。在Typescript中,内部工具类型也同样使用到了keyof实现。所以现在来一起学习一下。keyof用法直通车🚗


在这里插入图片描述

一、Partial

描述:

Constructs a type with all properties of Type set to optional. This utility will return a type that represents all subsets of a given type.

中文翻译:

传入的泛型类型中所有的属性都变成可选的。

例如:
我们有一个ObjType的type类型,其中包含两个属性,name,age。Partial传入泛型中,得到新的Person类型。

type ObjType = {
  name: string;
  age: number;
}
type Person =  Partial<ObjType>

这样使用后就相当于定义了一个可选参数的类型例如:

type ObjType1 = {
  name?: string;
  age?: number;
}

使用方法:
定义几个person可以初始化定义不同对象的属性,如下。

const person1: Person = {name: '1', age: 1}
const person2: Person = {name: '1'}
const person3: Person = {age: 1}
const person4: Person = {}

原码:
type Partial = { [P in keyof T]?: T[P] | undefined; }

二、Required

描述:

Constructs a type consisting of all properties of Type set to required. The opposite of Partial.

中文翻译:

那么它的意思就是,要求传入的泛型类型的属性都是必输项。

例如:
我们有一个ObjType类型,它的每个属性都是可选参数,但是现在用Required转换类型,那么它的每一个属性都变成必输项。

type ObjType = {
  name?: string;
  age?: number;
}
type Person =  Required<ObjType>

这样使用后就相当于定义了一个必选参数的类型例如:

type ObjType = {
  name: string;
  age: number;
}

使用方法:
那么它的每一项都必须符合类型定义:

//正确:
const person1: Person = {name: '1', age: 1}
//错误:
const person2: Person = {name: '1'}
//Property 'age' is missing in type '{ name: string; }' but required in type 'Required<ObjType>'.ts(2741)
const person3: Person = {age: 1}
//Property 'name' is missing in type '{ age: number; }' but required in type 'Required<ObjType>'.ts(2741)
const person4: Person = {}
//Type '{}' is missing the following properties from type 'Required<ObjType>': name, agets(2739)

原码:
type Required = { [P in keyof T]-?: T[P]; }

三、Pick<Type, Keys>

描述:

Constructs a type by picking the set of properties Keys (string literal or union of string literals) from Type.

中文翻译:

从泛型Type中获取指定属性的类型,相当于得到的新类型只包含你所指定的泛型第二个参数的属性的类型。

例如:
还是上面类型,传入指定泛型类型,得到新的Person类型

type ObjType = {
  name: string;
  age: number;
}
type Person =  Pick<ObjType, 'name'>

这样使用后就相当于定义了一个指定类型例如:

Person就相当于type ObjType = {name: string}
使用方法:

//正确
type Person =  Pick<ObjType, 'name'>
const person2: Person = {name: '1'}
type Person =  Pick<ObjType, 'age'>
const person3: Person = {age: 1}
//报错:
const person2: Person = {name: '1', age: 1}
//Type '{ name: string; }' is not assignable to type 'Person'.
//Object literal may only specify known properties, and 'name' does not exist in type 'Person'.ts(2322)

原码:
type Pick<T, K extends keyof T> = { [P in K]: T[P]; }

四、Record<Keys, Type>

描述:

Constructs an object type whose property keys are Keys and whose property values are Type. This utility can be used to map the properties of a type to another type.

中文翻译:

接受两个泛型参数,第一个是对象属性key,第二个参数是key所对应的值的类型。

例如:
有个Test的接口,首先通过keyof获得它的联合类型,然后传入Record中的泛型中。得到新的类型

interface Test {
  person1: string;
  person2: string;
}
type Persons = keyof Test
type Person =  Record<Persons, ObjType>

这样相当于定义了一个新的类型如下:

type Person = {
  person1: {
    name: string;
    age: number;
  };
  person2: {
    name: string;
    age: number;
  }
}

使用方法:

const person1: Person = {
  person1: {
    name: '1',
    age: 1
  },
  person2: {
    name: '1',
    age: 1
  }
}
console.log(person1)

原码:
type Record<K extends string | number | symbol, T> = { [P in K]: T; }


总结

总结不易,如有问题欢迎指出。互相学习。

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

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

相关文章

OpenGaussDB2.0.1

目录 1. GaussDB版本2. OpenGaussDB介绍3. 单节点安装3.1 环境配置3.2 安装 4. 远程连接设置 1. GaussDB版本 GaussDB的版本&#xff1a; GaussDB 100&#xff1a;目前暂不发布&#xff0c;公司合作伙伴需向华为提交申请&#xff08;GaussDB 100 将在 2020 年被正式命名为 Gaus…

Redis入门 - 3种特殊数据类型

原文首更地址&#xff0c;阅读效果更佳&#xff01; Redis入门 - 3种特殊数据类型 | CoderMast编程桅杆https://www.codermast.com/database/redis/three-special-datatype.html 在我们平常的业务中基本只会使用到Redis的基本数据类型&#xff08;String、List、Hash、Set、S…

浅谈.NET语言开发应用领域

.NET语言是一种跨平台的开发框架&#xff0c;适用于各种应用程序的开发。以下是一些常见的.NET语言开发应用领域&#xff1a; 桌面应用程序开发&#xff1a;使用.NET框架开发的桌面应用程序可以在Windows操作系统上运行&#xff0c;包括Windows Forms和WPF。这些应用程序可以用…

CentOS开机报错““error can‘t find command ‘:‘“处理方法

CentOS开机报错"error cant find command :"处理方法 本文为故障描述和问题记录。converterP2V迁移CentOS7到虚拟机&#xff0c;开机报错"error can’t find command ‘:’"的处理方法。 本文为CentOS7的操作记录&#xff0c;其他版本可以参考&#xff0c;…

CASAIM光学彩色三维扫描仪助力文物艺术品三维数字化3D打印

文物艺术品数字化&#xff0c;实际上是一种文物艺术品信息的记录方式&#xff0c;除了运用视频、照片、录音等多媒体形式将某些文物进行记录外&#xff0c;文物艺术品数字化主要是指针对有形文化遗产采用非接触式扫描得到的三维数字化记录&#xff0c;通过实景三维建模&#xf…

GitHub 上传自己的项目

文章目录 前言一、步骤1.GitHub 创建项目2.Git 上传本地项目到 GitHub3.Git 命令整理 总结 前言 不附 Demo 连接的博客不是好博客&#xff0c;所以我们要做个乐于助人&#xff0c;有责任心的人&#xff0c;这篇文章手把手教你如何在 GitHub 上传自己的项目&#xff0c; 一、步…

【OpenMMLab AI实战营二期笔记】第五天 MMPretrain代码课

1.环境安装 conda activate mmpre # 激活创建好的环境,确保安装好pytorch,可以使用gpu git clone https://github.com/open-mmlab/mmpretrain.git # 下载mmpre源码 cd mmpretrain # 进入mmpretrian目录 pip install openmim # 安装管理工具 mim install -e ".[multimodal…

JAVA开发运维(系统上到生产环境准备工作)

一、前言 java项目在开发环境开发完成&#xff0c;在测试环境测试没有问题后&#xff0c;就需要发布到生产环境&#xff0c;如果系统是对公众的&#xff0c;那就需要很多工作了。比如服务器申请&#xff0c;域名申请&#xff0c;渗透测试&#xff0c;漏洞扫描&#xff0c;公网…

第二章(第二节):导数与微分

1.导数与微分 1.导数概念 设曲线 L 的方程 y=f(x),a ≤ x ≤ b,x0 ∈ (a, b),在曲线 L 上的点 M0(x0, y0) 附近任取一点 M(x0 + Δx, y0 + Δy),过 M0 与 M 作曲线的割线M~0~M,的斜率为:当 x→x0 时,点 M 沿着曲线 L 趋向 M0,与此同时,割线 M0M 趋向一个极限位置 M0T…

想要转行的一定要看软件测试发展简史+学习路线

迄今为止&#xff0c;软件测试的发展一共经历了五个重要时期&#xff1a; 调试为主 20世纪50年代&#xff0c;计算机刚诞生不久&#xff0c;只有科学家级别的人才会去编程&#xff0c;需求和程序本身也远远没有现在这么复杂多变&#xff0c;相当于开发人员一人承担需求分析&am…

idea设置注释模板

目录 设置注释文件模板设置模板 设置注释文件模板 Ctrl Alt S 打开设置&#xff0c;Editor - File and Code Templates 选择class、interface、enum根据自己需要选择需要添加注释的文件&#xff0c;依次添加如下配置内容 /**1. ClassName ${NAME}2. Description TODO3. Aut…

BUUCTF Unencode 1

题目描述&#xff1a; 密文&#xff1a; 89FQA9WMD<V1A<V1S83DY.#<W3$Q,2TM]解题思路&#xff1a; 1、观察密文&#xff0c;尝试Base85、Base91等编码&#xff0c;均失败。 2、结合题目&#xff0c;联想到UUencode编码&#xff0c;尝试后成功&#xff0c;得到flag。 …

驱动LSM6DS3TR-C实现高效运动检测与数据采集(5)----上报匿名上位机实现可视化

概述 lsm6ds3trc包含三轴陀螺仪与三轴加速度计。 姿态有多种数学表示方式&#xff0c;常见的是四元数&#xff0c;欧拉角&#xff0c;矩阵和轴角。他们各自有其自身的优点&#xff0c;在不同的领域使用不同的表示方式。在四轴飞行器中使用到了四元数和欧拉角。 姿态解算选用的…

SpringBoot配置多数据源

SpringBoot配置多数据源 最近在做一个SpringBoot项目时需要关联两个数据库,于是乎我就研究了下关于springboot的多数据源配置,记录配置过程,分享一下 一、基础配置 (这里只展示主要配置) JDK1.8springBoot2.3.4.RELEASEmybatis2.1.0mysql-connector-java 8.0.21maven仓…

知乎家居产品种草营销怎么做?

近年来&#xff0c;家居产品种草营销已经成为了一种新型营销方式。知乎作为全球最大的中文问答社区&#xff0c;拥有着海量的用户和优质内容&#xff0c;逐渐成为了家居产品种草营销中不可忽视的平台。那么&#xff0c;在这个平台上如何进行家居产品种草营销呢&#xff1f;接下…

Python之函数【三】(高阶函数和闭包)

文章目录 前言一、高阶函数二、闭包&#xff08;也称之为&#xff1a;闭包函数&#xff09; 1、浅谈闭包函数 1.1、划重点1.2、注意点2、怎么判断是不是闭包函数呢&#xff1f; 2.1、那接下来&#xff0c;我们就细细的拆开解释2.2、对于这个作用域&#xff0c;在JavaSc…

【MySQL数据库基础】

MySQL数据库基础 1. 数据库的操作1.1 显示当前的数据库1.2 创建数据库1.3 使用数据库1.4 删除数据库 2. 常用数据类型2.1整数&#xff08;xxxint&#xff09;2.2日期时间类型2.3字符串型 3. 表的操作3.1 查看表结构3.2 创建表3.3 删除表 1. 数据库的操作 1.1 显示当前的数据库…

Es索引中时间字段是字符串Range查询的正确姿势

文章目录 [toc] 1. 问题2. Es索引的mapping模式2.1 dynamic动态宽松模式&#xff08;动态映射&#xff09;2.2 strict严格模式&#xff08;静态映射&#xff09; 3. text类型和keyword类型的区别3.1 text类型3.2 keyword类型 4.正确姿势5. 总结 1. 问题 由于之前搞了一个使用fl…

230616安装SqlServer2017Express

230616安装SqlServer2017Express 下载地址 选择语言 Microsoft SQL Server 2017 Express 下载地址: 简体中文 感谢下载 Microsoft SQL Server 2017 Express 我将下载的文件的名称加上了SHA256值, 一长串 是一个 .exe 的自解压文件, 双击后,默认解压到同根文件夹\同名文件夹下,…

那些可以当源码学习的优质开源项目分享

本篇收集的是自己平时逛 Github 发现的一些优质的开源项目&#xff0c;为什么收集它&#xff1f; 借助优质的开源项目&#xff0c;我们不仅可以拿来二次开发快速实现想要的功能&#xff0c;而且还可以学习里面优秀的代码&#xff0c;提高我们的编程能力。读&#xff08;拆解&am…