在 TypeScript 的類(lèi)型系統(tǒng)中，映射類(lèi)型（Mapped Types）是一種強(qiáng)大的工具，它允許開(kāi)發(fā)者基于現(xiàn)有的類(lèi)型創(chuàng)建新的類(lèi)型。通過(guò)映射類(lèi)型，可以方便地對(duì)類(lèi)型的每個(gè)屬性進(jìn)行轉(zhuǎn)換或操作，而無(wú)需手動(dòng)重新定義整個(gè)類(lèi)型。本文將詳細(xì)介紹三種常用的映射類(lèi)型：Readonly、Partial 和 Required，探討它們的用途、實(shí)現(xiàn)原理以及在實(shí)際開(kāi)發(fā)中的應(yīng)用場(chǎng)景。

Readonly：創(chuàng)建只讀類(lèi)型

Readonly 是 TypeScript 提供的一個(gè)內(nèi)置映射類(lèi)型，它的作用是將一個(gè)類(lèi)型的所有屬性都設(shè)置為只讀。這意味著，一旦使用 Readonly 創(chuàng)建了一個(gè)新類(lèi)型，該類(lèi)型的任何屬性都不能被重新賦值。

基本用法

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

type ReadonlyType = Readonly<OriginalType>;

const obj: ReadonlyType = {
  name: 'Alice',
  age: 25,
};

obj.name = 'Bob'; // 錯(cuò)誤：Cannot assign to 'name' because it is a read-only property.

在上述代碼中，OriginalType 定義了一個(gè)包含 name 和 age 屬性的對(duì)象類(lèi)型。通過(guò) Readonly 映射類(lèi)型，我們創(chuàng)建了一個(gè) ReadonlyType，它的所有屬性都變成了只讀。嘗試修改 obj 的 name 屬性會(huì)導(dǎo)致編譯錯(cuò)誤。

實(shí)現(xiàn)原理

Readonly 的實(shí)現(xiàn)原理相對(duì)簡(jiǎn)單，它使用了 TypeScript 的映射類(lèi)型語(yǔ)法，遍歷原始類(lèi)型的每個(gè)屬性，并為每個(gè)屬性添加 readonly 修飾符。其大致實(shí)現(xiàn)如下（簡(jiǎn)化版）：

type MyReadonly<T> = {
  readonly [P in keyof T]: T[P];
};

在這個(gè)自定義的 MyReadonly 類(lèi)型中，[P in keyof T] 是一個(gè)映射類(lèi)型的關(guān)鍵部分，它表示遍歷 T 類(lèi)型的所有鍵（屬性名），并為每個(gè)鍵創(chuàng)建一個(gè)新的屬性，同時(shí)保留原始屬性的類(lèi)型 T[P]。通過(guò)添加 readonly 修飾符，我們確保了新類(lèi)型的每個(gè)屬性都是只讀的。

Partial：創(chuàng)建部分類(lèi)型

Partial 是另一個(gè)常用的內(nèi)置映射類(lèi)型，它的作用是將一個(gè)類(lèi)型的所有屬性都設(shè)置為可選。這在處理某些場(chǎng)景時(shí)非常有用，比如當(dāng)我們需要更新一個(gè)對(duì)象的部分屬性時(shí)，不需要提供所有屬性的值。

基本用法

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

type PartialType = Partial<OriginalType>;

const obj: PartialType = {
  name: 'Alice',
  // age 可以省略
};

在上述代碼中，PartialType 是通過(guò) Partial 映射類(lèi)型從 OriginalType 創(chuàng)建的。由于所有屬性都變成了可選，因此在定義 obj 時(shí)，可以只提供 name 屬性，而省略 age 屬性。

實(shí)現(xiàn)原理

Partial 的實(shí)現(xiàn)原理與 Readonly 類(lèi)似，也是通過(guò)映射類(lèi)型遍歷原始類(lèi)型的每個(gè)屬性，并為每個(gè)屬性添加 ? 修飾符，使其成為可選屬性。其大致實(shí)現(xiàn)如下（簡(jiǎn)化版）：

type MyPartial<T> = {
  [P in keyof T]?: T[P];
};

在這個(gè)自定義的 MyPartial 類(lèi)型中，[P in keyof T]? 表示遍歷 T 類(lèi)型的所有鍵，并為每個(gè)鍵創(chuàng)建一個(gè)新的可選屬性，同時(shí)保留原始屬性的類(lèi)型 T[P]。

Required：創(chuàng)建必需類(lèi)型

與 Partial 相反，Required 映射類(lèi)型的作用是將一個(gè)類(lèi)型的所有屬性都設(shè)置為必需。這在處理某些需要確保所有屬性都被提供的場(chǎng)景時(shí)非常有用。

基本用法

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

type RequiredType = Required<OriginalType>;

const obj: RequiredType = {
  name: 'Alice',
  age: 25,
  // 如果省略任何一個(gè)屬性，都會(huì)導(dǎo)致編譯錯(cuò)誤
};

在上述代碼中，OriginalType 的所有屬性都是可選的。通過(guò) Required 映射類(lèi)型，我們創(chuàng)建了一個(gè) RequiredType，它的所有屬性都變成了必需。因此，在定義 obj 時(shí)，必須提供 name 和 age 屬性的值，否則會(huì)導(dǎo)致編譯錯(cuò)誤。

實(shí)現(xiàn)原理

Required 的實(shí)現(xiàn)原理是通過(guò)映射類(lèi)型遍歷原始類(lèi)型的每個(gè)屬性，并移除每個(gè)屬性上的 ? 修飾符（如果存在的話），從而使其成為必需屬性。由于 TypeScript 的類(lèi)型系統(tǒng)沒(méi)有直接提供“移除可選修飾符”的語(yǔ)法，因此 Required 的實(shí)現(xiàn)稍微復(fù)雜一些，它使用了條件類(lèi)型和 never 類(lèi)型來(lái)間接實(shí)現(xiàn)這一目標(biāo)。其大致實(shí)現(xiàn)如下（簡(jiǎn)化版）：

type MyRequired<T> = {
  [P in keyof T]-?: T[P];
};

在這個(gè)自定義的 MyRequired 類(lèi)型中，[P in keyof T]-? 表示遍歷 T 類(lèi)型的所有鍵，并為每個(gè)鍵創(chuàng)建一個(gè)新的屬性，同時(shí)移除原始屬性上的可選修飾符（如果存在的話）。-? 是 TypeScript 提供的一個(gè)語(yǔ)法，用于移除屬性的可選修飾符。

總結(jié)

映射類(lèi)型是 TypeScript 類(lèi)型系統(tǒng)中一個(gè)非常強(qiáng)大的特性，它允許開(kāi)發(fā)者基于現(xiàn)有的類(lèi)型創(chuàng)建新的類(lèi)型。Readonly、Partial 和 Required 是三種常用的內(nèi)置映射類(lèi)型，它們分別用于創(chuàng)建只讀類(lèi)型、部分類(lèi)型和必需類(lèi)型。通過(guò)理解它們的用途和實(shí)現(xiàn)原理，我們可以更好地利用這些映射類(lèi)型來(lái)提高代碼的健壯性和可維護(hù)性。在實(shí)際開(kāi)發(fā)中，根據(jù)具體的需求選擇合適的映射類(lèi)型，可以大大簡(jiǎn)化類(lèi)型定義和類(lèi)型檢查的工作。

到此這篇關(guān)于TypeScript 映射類(lèi)型Readonly、Partial、Required 的使用的文章就介紹到這了,更多相關(guān)TypeScript Readonly Partial Required 內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論