打字稿：什么是映射类型，这有什么用？

Question

打字稿：什么是映射类型？

• 它是如何工作的？
• 我应该什么时候使用它？
• 示例

Answer 1

Typescript mapped types：

在 Typescript 中，我们有时希望基于其他类型构建类型。映射类型允许我们以非常简洁的方式基于现有类型生成新类型，这使我们遵守不要重复自己原则

---

自定义属性：

• 问题：我们事先并不知道对象类型的所有属性
• 解决方案：我们可以声明自定义属性并使用以下语法键入它们：

---

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'.
};

---

映射类型：

• 问题：我们将一个对象类型建立在另一种类型的基础上，我们不想定义每个类型的所有属性
• 解决方案：我们可以声明自定义属性并使用以下语法键入它们：

---

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。自定义属性和映射类型的区别如下：

• 映射类型使用泛型和 [Property in keyof Type] 语法迭代现有类型的属性。它将现有类型的所有属性映射到您可以根据需要自定义的新类型。
• 自定义属性让您可以输入您事先不知道的对象的属性。当我们不知道对象究竟是什么样子时，这很有用。对象可以具有在编写代码时未知的属性。