Typescript：什么是映射類型，它有什么用處？

Question

Typescript：什么是映射類型？

• 它是如何工作的？
• 我應該什么時候使用它？
• 例子

Answer 1

Typescript 映射類型：

在 Typescript 中，我們有時希望基於其他類型構建類型。 映射類型允許我們以非常簡潔的方式基於現有類型生成新類型，這使我們遵守不重復自己的原則

---

自定義屬性：

• 問題：我們事先不知道 object 類型的所有屬性
• 解決方案：我們可以聲明自定義屬性並使用以下語法鍵入它們：

---

type customProperties = {
  [key: string]: string | boolean;
};

const conforms: customProperties = {
  str: 'foo',
  bool: true,
  // int: 123 > Error Type 'number' is not assignable to type 'string | boolean'.
};

---

映射類型：

• 問題：我們將 object 類型基於另一種類型，並且我們不想在每種類型中定義所有屬性
• 解決方案：我們可以聲明自定義屬性並使用以下語法鍵入它們：

---

type Person = {
  name: string;
  age: string;
};

// Demo only >> TS has a builtin Readonly, use that
type myReadonly<Type> = {
  readonly [Property in keyof Type]: Type[Property];
};

// Demo only >> TS has a builtin Partial, use that
type myPartial<Type> = {
  [Property in keyof Type]?: Type[Property];
};

type ReadonlyPerson = myReadonly<Person>
type PartialPerson  = myPartial<Person>

---

請注意，映射類型使用語法[]: type of custom properties。 自定義屬性和映射類型的區別如下：

• 映射類型使用 generics 和[Property in keyof Type]語法對現有類型的屬性進行迭代。 它將現有類型的所有屬性映射到您可以根據需要自定義的新類型。
• 自定義屬性可讓您鍵入您事先不知道的 object 的屬性。 當我們不知道 object 究竟是什么樣子時，這很有用。 object 具有在編寫代碼時未知的屬性。