Typescript Pick|极客教程

Typescript Pick

在Typescript中，我们经常需要从一个类型中选择部分属性来创建一个新类型。Typescript提供了一个工具类型Pick<T, K>来实现这个功能。在本文中，我们将详细讨论Pick的使用和其背后的原理。

1. 什么是`Pick`？

Pick是Typescript中的一个工具类型，用于从给定类型T中选择指定的属性K。它以两个类型参数的形式出现：T表示原始类型，K表示要选择的属性。

type Pick<T, K extends keyof T> = {
  [P in K]: T[P];
};

这是Pick的定义。从定义中可以看出，Pick返回一个新的类型，其中只包含选择的属性。选择的属性是通过K的键列表来指定的，这些键必须是原始类型T的属性。

2. 使用示例

为了更好地理解Pick的使用，我们将通过几个示例来演示。假设我们有一个名为Person的接口，它有一些属性，例如name、age和gender。

interface Person {
  name: string;
  age: number;
  gender: string;
  email: string;
}

2.1 选择一个属性

首先，让我们尝试从Person中选择一个属性。假设我们只对name属性感兴趣，我们可以使用Pick来创建一个新的类型，仅包含所选的属性。

type Selected = Pick<Person, 'name'>;

上面的代码中，Selected是一个新的类型，其中只包含Person中的name属性。现在我们可以使用Selected声明变量并赋予它一个值。

const person: Selected = {
  name: 'John',
};

2.2 选择多个属性

除了选择一个属性，我们还可以选择多个属性来创建一个新类型。假设我们对name和age两个属性感兴趣，我们可以通过将它们作为K的键列表传递给Pick来实现。

type Selected = Pick<Person, 'name' | 'age'>;

上面的代码中，Selected是一个新的类型，其中只包含Person中的name和age属性。我们可以使用Selected声明变量并赋予它一个值。

const person: Selected = {
  name: 'John',
  age: 30,
};

2.3 动态选择属性

Pick还可以用于动态选择属性。假设我们有一个包含一组属性名称的数组PropertyName[]，我们可以使用Pick根据数组动态选择属性。

type PropertyName = 'name' | 'age' | 'gender';

function pickProperties(props: PropertyName[]): Pick<Person, PropertyName> {
  const result: any = {};
  for (const prop of props) {
    result[prop] = person[prop];
  }
  return result;
}

const selected = pickProperties(['name', 'age']);

在上面的代码中，propertyName是属性名称的联合类型。我们定义了一个名为pickProperties的函数，用于根据传入的属性列表选择属性。函数内部通过遍历属性列表，动态从person对象中选择属性，并将结果存储在result对象中。

3. 原理解析

在Pick的定义中，我们使用了索引类型和映射类型两个重要的概念。

3.1 索引类型

在Typescript中，我们可以使用索引类型来访问和操作对象的属性。索引类型允许我们通过字符串或数字索引来访问对象的属性。

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

type NameType = Person['name']; // string
type AgeType = Person['age']; // number

在上面的代码中，Person['name']和Person['age']分别返回name和age属性的类型。

3.2 映射类型

映射类型是一种用于从旧类型中创建新类型的工具。它通过遍历旧类型的属性，并在新类型中重新映射每个属性来实现。

在Pick的定义中，我们使用了in关键字来定义一个新类型的属性。通过P in K，我们将K中的每个键重新映射到新类型中，并将其类型设置为T[P]（T类型中与该键对应的属性的类型）。

type Pick<T, K extends keyof T> = {
  [P in K]: T[P];
};

在上面的代码中，P in K是一个映射类型，它遍历键列表K，并将每个键重新映射到新类型中。

4. 注意事项

在使用Pick时，有几个要注意的地方。

选择的属性必须存在于原始类型中。
Pick返回的新类型将继承原始类型的所有属性修饰符，如只读、可选等。

5. 总结

Pick是Typescript中一个强大的工具类型，用于从给定的类型中选择属性创建一个新类型。通过选择单个属性、多个属性或动态选择属性，我们可以轻松地创建一个包含所需属性的新类型。掌握Pick和背后的原理对于编写类型安全的代码非常重要，它可以帮助我们更好地理解和利用Typescript的类型系统。