成人免费xxxxx在线视频软件_久久精品久久久_亚洲国产精品久久久_天天色天天色_亚洲人成一区_欧美一级欧美三级在线观看

TS 類型體操:索引類型的映射再映射

開發 項目管理
TypeScript 給 JavaScript 加了套靜態類型系統。其中,JavaScript 中的數組、對象等聚合多個元素的類型在 TypeScript 中對應的是索引類型。

TypeScript 給 JavaScript 加了套靜態類型系統。其中,JavaScript 中的數組、對象等聚合多個元素的類型在 TypeScript 中對應的是索引類型。

比如這就是一個索引類型:

type obj = {
name: string;
age: number;
gender: boolean;
}

索引類型可以添加修飾符 readonly(只讀)、?(可選):

type obj = {
readonly name: string;
age?: number;
gender: boolean;
}

我們知道,TypeScript 支持類型編程,也就是對類型參數(范型)做各種運算,產生新的類型:

type IsString<T> = T extends string ? true: false;

那么對于索引類型,如何做運算并產生新的類型呢?

答案是映射類型。

映射類型

映射類型就是用于構造新的索引類型的。

比如這個 Record 類型:

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

Record 類型構造了一個 key 為 stirng 或 number 或 symbol,而 value 為類型 T 的索引類型。它是 TS 內置的高級類型。

在構造新的索引類型的過程中,還可以做加上一些修飾符。

比如 ReadOnly:

type Readonly<T> =  {
readonly [Key in keyof T]: T[Key];
}

它創建了一個新的索引類型,在原來索引類型的每個屬性上加上了 readonly 的修飾:

比如 Partial:

type Partial<T> = {
[Key in keyof T]?: T[Key]
}

它創建了一個新的索引類型,在原來索引類型的每個屬性上加上了 ? 的修飾:

可以加上,當然也可以去掉:

去掉可選(?):

type Required<T> = {
[Key in keyof T]-?: T[Key]
}

去掉 readonly:

type NotReadOnly<T> = {
-readonly [Key in keyof T]: T[Key]
}

過完這些例子,映射類型能干什么就比較清楚了:

映射類型可以生成新的索引類型,在生成過程中可以加上或去掉 readonly、? 的修飾符。內置的 Record、ReadOnly、Required、Partial 等類型都是映射類型。

但是,現在的映射類型還是有局限性的,不能對索引名做修改、過濾等操作,功能還不夠強。

如果想實現過濾、轉換,那就得用到映射類型的重映射了。

重映射

重映射就是在索引后加一個 as 語句,表明索引轉換成什么,它可以用來對索引類型做過濾和轉換。

比如過濾出類型為 string 的索引:

type FilterString<T> = {
[Key in keyof T as T[Key] extends string ? Key: never]: T[Key];
}

返回 never 代表過濾掉,否則保留。

還可以對索引做轉換,比如修改索引名,加上 get:

type Getters<T extends Record<any, any>> = {
[Key in keyof T as `get${Capitalize<Key & string>}`]: T[Key];
}

T extends xxx 是給類型參數的約束,表示只能傳入這種類型。這里的 Record 類型是生成索引類型的,我們上面介紹過,所以 T extends Record 就是約束了這里只能傳入索引類型。

as 后面是把索引轉換成什么,我們是在原來的基礎上做了修改,加上了 get,并且后面內容首字母大寫,這個 Capitalize 也是 TS 內置的類型。

效果如下:

這兩個例子分別說明了重映射 as 可以用來做索引類型的過濾和轉換,可以對索引類型做更靈活的編程。

比如,實現 key 和 value 的互換:

type Flip<T extends Record<any, any>> = {
[Key in keyof T as `${T[Key]}`]: Key
}

支持重映射之后,映射類型可以對索引類型做更多的修改。

總結

TypeScript 通過索引類型來表示有多個元素的聚合類型,比如數組、對象等。

TS 支持類型編程,也就是對類型參數做各種運算然后返回新的類型。對索引類型當然也可以做運算,對應的類型就是映射類型。

映射類型在生成新的索引類型的過程中,還可以加上或去掉 readonly、?的修飾符。內置的 Record、Required、Partial、ReadOnly 都是映射類型。

如果想對索引類型做進一步的過濾和轉換,就需要用到 as 的重映射,它可以對索引做修改(當索引為 never 就代表過濾掉該索引)。

會用索引類型是只是基礎,會用映射類型和重映射就是進階內容了,這部分可以寫出很多復雜的類型邏輯,屬于類型體操的范疇。


責任編輯:武曉燕 來源: 神光的編程秘籍
相關推薦

2022-04-29 06:54:48

TS 映射類型User 類型

2022-08-08 09:00:42

TypeScript映射類型

2009-09-25 12:31:13

Hibernate映射

2022-02-12 22:16:53

TypeScript類型字符串

2022-08-14 06:59:01

TS 類型編程索引類型

2021-12-25 22:29:31

類型編程Javascript類型體操

2024-03-04 06:40:49

工具類型TypeScripDeepPick

2011-03-17 09:06:58

iptables映射端口

2024-02-19 10:24:32

Chainable工具類型類型體操

2009-06-18 15:53:37

Hibernate B

2010-10-26 17:34:03

Oracle索引

2022-09-20 14:43:55

TypeScript類型體操

2022-08-08 23:49:01

TypeScriptumd模塊

2022-04-17 10:29:10

TSTypeScript對象類型

2024-07-08 10:48:51

2009-06-22 09:48:00

J2EE web se

2012-02-03 11:17:33

HibernateJava

2010-10-08 13:53:14

2022-05-07 07:33:55

TypeScript條件類型

2022-12-30 08:08:30

點贊
收藏

51CTO技術棧公眾號

主站蜘蛛池模板: 精品视频免费 | 日韩毛片| 久久影音先锋 | 欧美无乱码久久久免费午夜一区 | 国产日韩精品视频 | 日韩国产欧美一区 | 成人性视频免费网站 | 欧美中文字幕一区二区 | 一区二区在线观看av | 天天搞天天搞 | 精品久久久久久久久亚洲 | 99伊人| 2020亚洲天堂 | 在线免费观看视频你懂的 | 日韩在线中文字幕 | 国产精品久久久久久一区二区三区 | 国产成人短视频在线观看 | 黄色在线免费观看 | 亚洲欧美激情精品一区二区 | 国产精品成人一区二区三区夜夜夜 | 亚洲午夜精品 | 午夜精品一区二区三区在线视频 | 天天操 夜夜操 | 午夜av毛片 | 国内91在线 | 蜜桃一区二区三区 | 亚洲精品一区二区三区蜜桃久 | 久久久国产精品 | 国产成人免费视频网站高清观看视频 | 伊大人久久| 中文字幕视频在线 | 精品久久国产 | 欧美舔穴 | 亚洲国产精品人人爽夜夜爽 | 日韩高清一区 | 日韩精品视频在线 | 性色综合 | 亚洲国产精品一区二区久久 | 羞视频在线观看 | 99综合在线| 精品欧美一区免费观看α√ |