什么是泛型
泛型（Generics）是指在定义函数、接口、类、类型别名的时候，不预先指定具体的类型，而在使用的时候再指定类型的一种特性。
通俗一点解释，泛型就是类型系统中的“参数”，主要作用是为了类型的重用。从上面定义可以看出，它只会用在函数、接口、类和类型别名中。它和 js 程序中的函数参数是两个层面的事物（虽然意义是相同的），称它为“参数”，是因为它具备和函数参数一模一样的特性。
看一个典型的例子
假设我们定义一个函数，它可以接收一个number类型做为参数，并且返回一个number类型。
function copy(data: number): number {
return data;
}
按照以上的写法是没有问题的，但是如果我们要接受一个string并返回一个string呢？如果逻辑一样还要在写一遍吗？就像下面这样。
function copy(data: string): string {
return data;
}
如果再来10种类型，就需要再定义10个函数，这显然代码是很冗余的。在typeScript中要覆盖所有可能性，明显只能选择 any 类型了：
function copy(data: any): any {
return data;
}
这还挺行得通的，但此刻你的函数实际上丢失了所有类型的概念，你将不能在本该有确定类型信息的地方使用它们了。本质上来说现在你可以传入任何值而编译器将一言不发，这和你使用普通的 JavaScript 就没有区别了（即无论怎样都没有类型信息了）。
我们该如何修复这点并避免使用 any 类型呢？
泛型来拯救
一个泛型就像若干类型的一个变量，这意味着我们可以定义一个表示任何类型的变量，同时能保持住类型信息。后者是关键，因为那正是 any 做不到的。基于这种想法，现在可以这样重构我们的 copy 函数：
//在函数后面用“<>”声明一个类型变量
function copy<T>(data: T):T {
return data;
}
泛型通过一对尖括号来表示(<>)，尖括号内的字符被称为类型变量，这个变量用来表示类型。
data: T 表示声明参数是 T 类型的，后面的 : T 表示返回值也是 T 类型的。
这个类型 T，在没有调用 copy 函数的时候并不确定，只有调用 copy 的时候，我们才知道 T 具体代表什么类型。
const str = copy<string>('my name is typescript')
我们在 VS Code 中可以看到 copy 函数的参数以及返回值已经有了类型，也就是说我们调用 copy 函数的时候，给类型变量 T 赋值了 string。
多个类型参数
我们在定义范型的时候，也可以一次定义多个类型参数，像下面这样。
function swap<T, U>(data: [T, U]):[U, T] {
return [data[1], data[0]];}
泛型参数默认类型
在 TypeScript 2.3 以后，我们可以为泛型中的类型参数指定默认类型。当使用泛型时没有在代码中直接指定类型参数，从实际值参数中也无法推断出类型时，这个默认类型就会起作用。
泛型参数默认类型与普通函数默认值类似，对应的语法很简单，即 <T=Default Type>，对应的使用示例如下：
function copy<T=string>(data: T):T {
return data;
}
const strA = copy('my name is typescript');
const numB = copy<number>(123);
泛型接口
interface GenericType<T> {
id: number;
name: T;
}
function showTypeOne(args: GenericType<string>) {
console.log(args);
}
showTypeOne({ id: 1, name: 'test' });
// Output: {id: 1, name: "test"}
function showTypeTwo(args: GenericType<number>) {
console.log(args);
}
showTypeTwo({ id: 1, name: 4 });
// Output: {id: 1, name: 4}
泛型类
泛型类即在声明类的时候声明泛型，那么在类的整个作用域范围内都可以使用声明的泛型类型。我们来新建一个存储数据的类：
class DataStorage {
private data = [];
addItem(item) {
this.data.push(item);
}
remove(item) {
this.data.splice(this.data.indexOf(item), 1);
}
getItems() {
return this.data;
}
}
由于类的属性和方法参数都没设置类型，所以报了错：
那么我们现在可以通过添加泛型来解决这个问题：
class DataStorage<T> {
private data: T[] = [];
addItem(item: T) {
this.data.push(item);
}
remove(item: T) {
this.data.splice(this.data.indexOf(item), 1);
}
getItems() {
return this.data;
}
}
const stringStorage = new DataStorage<string>();
stringStorage.addItem('A');
stringStorage.addItem('B');
stringStorage.addItem('C');
stringStorage.removeItem('C');
console.log(stringStorage.getItems());
这里我们把T设置成了string类型，我们可以根据自己的需要传入其它类型。
在React Typescript项目中的写法：
interface IProps {
className?: string;
...
}
interface IState {
submitted?: bool;
...
}
class MyComponent extends React.Component<IProps, IState> { ...
}
泛型约束
有了泛型之后，一个函数或类能处理的类型一下子扩到了无限大，似乎有点失控的感觉。所以这里又产生了一个约束的概念。下面我们来举几个例子，介绍一下如何使用泛型约束。
确保属性存在
有时候，我们希望类型变量对应的类型上存在某些属性。这时，除非我们显式地将特定属性定义为类型变量，否则编译器不会知道它们的存在。
一个很好的例子是在处理字符串或数组时，我们会假设 length 属性是可用的。让我们再次使用 copy 函数并尝试输出参数的长度：
function copy<T>(data: T): T {
console.log(data.length); // Error
return arg
}
在这种情况下，编译器将不会知道 T 确实含有 length 属性，尤其是在可以将任何类型赋给类型变量 T 的情况下。我们需要做的就是让类型变量 extends一个含有我们所需属性的接口，比如这样：
interface ILength {
length: number;
}
function copy<T extends ILength>(data: T): T {
console.log(data.length); // 可以获取length属性
return data
}
T extends Length 用于告诉编译器，我们支持已经实现 ILength 接口的任何类型。之后，当我们使用不含有 length 属性的对象作为参数调用 copy 函数时，TypeScript会提示相关的错误信息：
copy(68); // Error
// Argument of type '68' is not assignable to parameter of type 'Length'.
此外，我们还可以使用 , 号来分隔多种约束类型，比如：<T extends Length, Type2, Type3>。
检查对象上的键是否存在
泛型约束的另一个常见的使用场景就是检查对象上的键是否存在。不过在看具体示例之前，我们得来了解一下 keyof 操作符，**keyof 操作符是在 TypeScript 2.1 版本引入的，该操作符可以用于获取某种类型的所有键，其返回类型是联合类型。**我们来举个 keyof 的使用示例：
interface IButton {
type: string
text: string
}
type ButtonKeys = keyof IButton
// 等效于
type ButtonKeys = "type" | "text"
通过 keyof 操作符，我们就可以获取指定类型的所有键，之后我们就可以结合前面介绍的 extends 约束，即限制输入的属性名包含在 keyof 返回的联合类型中。具体的使用方式如下：
function getValue<T extends object, U extends keyof T>(obj: T, key: U) {
return obj[key] // ok
}
工具泛型
用 JavaScript 编写中大型程序是离不开 lodash 工具的，而用 TypeScript 编程同样离不开工具泛型的帮助，工具泛型就是类型版的 lodash 。简单的来说，就是把已有的类型经过类型转换构造一个新的类型。工具泛型本身也是类型，得益于泛型的帮助，使其能够对类型进行抽象的处理。工具泛型主要目的是简化类型编程的过程，提高效率。
TypesScript 中内置了很多工具泛型，内置的泛型在 TypeScript 内置的 lib.es5.d.ts 中都有定义，所以不需要任何依赖都是可以直接使用的。下面看看一些经常使用的工具泛型吧。
Partial
Partial<T> 的作用就是将某个类型里的属性全部变为可选项 ?。
type Partial<T> = {
[P in keyof T]?: T[P]
}
在以上代码中，首先通过 keyof T 拿到 T 的所有属性名，然后使用 in 进行遍历，将值赋给 P，最后通过 T[P] 取得相应的属性值。中间的 ? 号，用于将所有属性变为可选。
interface PartialType {
id: number;
firstName: string;
lastName: string;
}
/*
等效于
interface PartialType {
id?: number
firstName?: string
lastName?: string
}
*/
function showType(args: Partial<PartialType>) {
console.log(args);
}
showType({ id: 1 });
// Output: {id: 1}
showType({ firstName: 'John', lastName: 'Doe' });
// Output: {firstName: "John", lastName: "Doe"}
Required
Required 的作用刚好与 Partial 相反，就是将接口中所有可选的属性改为必须的，区别就是把 Partial 里面的 ? 替换成了 -?。
type Required<T> = {
[P in keyof T]-?: T[P]
}
Record
Record<K, T>可帮助我们构造具有给定类型T的一组属性K的类型。
type Record<K extends keyof any, T> = {
[P in K]: T
}
Record 接受两个类型变量，Record 生成的类型具有类型 K 中存在的属性，值为类型 T。这里有一个比较疑惑的点就是给类型 K 加一个类型约束，extends keyof any，我们可以先看看 keyof any 是个什么东西。
类型 K 被约束在 string | number | symbol 中，刚好就是对象的索引的类型，也就是类型 K 只能指定为这几种类型。
我们在业务代码中经常会构造某个对象的数组，但是数组不方便索引，所以我们有时候会把对象的某个字段拿出来作为索引，然后构造一个新的对象。假设有个人员列表的数组，要在人员列表中找到personId为1的人员信息，我们一般通过遍历数组的方式来查找，比较繁琐，为了方便，我们就会把这个数组改写成对象。
interface IPerson {
personId: string;
name: string;
age: number;
}
const personsMap: Record<string, IPerson> = {}
const personsList: IPerson[] = await ajax.get('/persons/list')
// personList = [{
// personId: '1',// name: '熊大',
// age: 10
// }, {
// personId: '2',
// name: '熊二',
// age: 8
// }]
personsMap = _.keyBy(personsList, 'personId');
// personsMap = {
// '1': {
// personId: '1',
// name: '熊大',
// age: 10
// },
// '2': {
// personId: '2',
// name: '熊二',
// age: 8
// }
// }
Extract
Extract<T, U>用来提取T中可以赋值给U的类型--取交集
type Extract<T, U> = T extends U ? T : never;
如果 T 中的类型在 U 存在，则返回，否则抛弃。假设我们两个接口类型，有三个公共的属性，可以通过 Extract 提取这三个公共属性。
interface Worker {
name: string
age: number
email: string
salary: number
}
interface Student {
name: string
age: number
email: string
grade: number
}
type CommonKeys = Extract<keyof Worker, keyof Student>
// 'name' | 'age' | 'email'
Exclude
type Exclude<T, U> = T extends U ? never : T
Exclude 的作用与之前介绍过的 Extract 刚好相反，如果 T 中的类型在 U 不存在，则返回，否则抛弃。现在我们拿之前的两个类举例，看看 Exclude 的返回结果。
interface Worker {
name: string
age: number
email: string
salary: number
}
interface Student {
name: string
age: number
email: string
grade: number
}
type ExcludeKeys = Exclude<keyof Worker, keyof Student>
// 'salary'
Pick
Pick<T, K>主要用于提取接口的某几个属性。
type Pick<T, K extends keyof T> = {
[P in K]: T[P]
}
我们可以通过 Pick 工具，提取 Todo 接口的两个属性，生成一个新的类型 TodoPreview。
interface Todo {
title: string
completed: boolean
description: string
}
type TodoPreview = Pick<Todo, "title" | "completed">
const todo: TodoPreview = {
title: 'Clean room',
completed: false
}
Omit
Omit<T, K>的作用与Pick类型正好相反。 不是选择元素，而是从类型T中删除K个属性。
type Omit<T, K extends keyof any> = Pick<
T, Exclude<keyof T, K>
>
先通过 Exclude<keyof T, K> 先取出类型 T 中存在，但是 K 不存在的属性，然后再由这些属性构造一个新的类型。还是通过前面的 Todo 案例来说，TodoPreview 类型只需要排除接口的 description 属性即可，写法上比之前 Pick 精简了一些。
interface Todo {
title: string
completed: boolean
description: string
}
type TodoPreview = Omit<Todo, "description">
const todo: TodoPreview = {
title: 'Clean room',
completed: false
}
什么时候用泛型
- 需要作用到很多类型的时候，比如文章前面介绍的copy函数
- 需要被用到很多地方的时候，比如上面介绍的工具泛型
需要注意的是，如果泛型的使用不能约束功能，或者缩小类型范围，就代表不需要用泛型：
function convert<T>(data: T[]): number {
return data.length
}
这样用泛型就和any类型没有什么区别
