typescript映射类型

本文介绍了TypeScript中的映射类型,它允许基于现有类型创建新类型并应用转换函数。通过映射类型,可以简化代码并减少冗余,如处理对象属性的类型转换和重复定义。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

ts映射类型简介

TypeScript中的映射类型(Mapped Type)是一种高级类型,它允许我们基于现有类型创建新的类型,同时对新类型的每个属性应用一个转换函数。通过使用映射类型,我们可以方便地对对象的属性进行批量操作,例如将所有属性的类型转换为另一种类型,或者为所有属性添加额外的修饰符。

ts类型映射

类型映射:基于旧类型创建新类型(对象类型).减少重复,提升开发效率

比如,类型ClassKey有x/y/z
另一类型myClass中也有x/y/z,并且MyClass中xyz类型相同
如下示例

在这里插入图片描述

根据类型别名创建映射类型

这样写没什么大问题,但是x/y/z重复写了两次,是冗余代码,像这种情况,就可以使用映射类型,来进行简化
示例如下
在这里插入图片描述
tips:

  • 映射类型是基于索引签名类型的,所以该语法类似于索引签名,也是用了[]符号
  • key in ClassKey 表示key可以是PropKeys类型别名中的任意一个,类似于forin(let k in obj)
  • 使用映射类型创建的新对象类型MyClass 和MyClassNew结构完全相同
  • 映射类型只能在类型别名中使用,不能在接口中使用

使用映射类型创建的新对象类型MyClass 和MyClassNew结构完全相同
示例如下

在这里插入图片描述

根据对象类型创建映射类型

映射类型出来根据联合类型创建新类型外,还可以根据对象类型来创建
在这里插入图片描述
这段代码首先定义了两个类型别名 MyClass 和 MyClassNew,其中 MyClass 是一个对象类型,具有三个属性 a、b 和 c,它们的类型分别是 number、string 和 boolean。而 MyClassNew 是一个映射类型,基于 MyClass 中的每个属性键创建一个新的属性,属性值为 number | string | boolean 类型。

接着创建了两个变量 myClass 和 myClassNew,并分别指定它们的类型为 MyClass 和 MyClassNew。然后初始化了这两个变量的值,都为 { a: 1, b: “2”, c: true }。由于这个值符合 MyClass 和 MyClassNew 的定义,所以可以将它赋值给这两个变量。

这段代码演示了如何使用类型别名和映射类型来定义和使用对象类型,以及如何创建符合这些类型的变量。通过使用映射类型,我们可以更方便地操作对象的属性类型,例如将对象的所有属性转换为另一种类型、为对象的所有属性添加默认值等等。

tips:

  1. 首先,先执行keyof MyClass获取到对象类型MyClass中所有键的联合类型即; ‘a’|‘b’|‘c’
  2. 然后key in 就表示key可以说MyClass中所有键名称中的任意一个
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Qayrup

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值