我们不仅要创建一致的定义良好的API，同时也要考虑可重用性。 组件不仅能够支持当前的数据类型，同时也能支持未来的数据类型，这在创建大型系统时为你提供了十分灵活的功能。
在像 C# 和 Java 这样的语言中，可以使用泛型来创建可重用的组件，一个组件可以支持多种类型的数据。 这样用户就可以以自己的数据类型来使用组件。
在 TypeScript 中，也可以使用泛型。
什么是泛型
创建一个返回任何传入的值的函数，如果不使用泛型，我们会这样写：
function log(arg: any): any {return arg;}
使用 any 类型会导致这个函数可以接收任何类型的 arg 参数，这样就丢失了一些信息：传入的类型与返回的类型应该是相同的（类型之间的约束关系），如果我们传入一个数字，我们只知道任何类型的值都有可能被返回。
:::info 泛型：不预先确定的数据类型，具体的类型在使用的时候才能确定。 :::
因此，我们需要一种方法使返回值的类型与传入参数的类型是相同的。 这里，我们使用了泛型参数，它是一种特殊的变量，只用于表示类型而不是值。
function log<T>(arg: T): T {
return arg;
}
T 帮助我们捕获用户传入的类型，之后我们就可以使用这个类型。 现在我们可以知道参数类型与返回值类型是相同的了。 这允许我们跟踪函数里使用的类型的信息。
我们把这个版本的 identity 函数叫做泛型，因为它可以适用于多个类型。 不同于使用 any，它不会丢失信息，传入数值类型就返回数值类型。
泛型函数的使用
我们定义了泛型函数后，可以用两种方法使用。
（1）传入所有的参数，包含类型参数：
let output = log<string>("myString");
这里我们明确的指定了 T 是 string 类型，并做为一个参数传给函数，使用了 <> 括起来而不是 ()。
（2）利用了类型推论 — 即编译器会根据传入的参数自动地帮助我们确定 T 的类型：
let output = log("myString");
注意我们没必要使用尖括号（<>）来明确地传入类型；编译器可以查看 myString 的值，然后把 T 设置为它的类型。类型推论帮助我们保持代码精简和高可读性。
如果编译器不能够自动地推断出类型的话，只能像上面那样明确的传入T的类型，在一些复杂的情况下，这是可能出现的。
泛型变量
使用泛型创建泛型函数时，编译器要求你在函数体必须正确的使用这个通用的类型。 换句话说，你必须把这些参数当做是任意或所有类型。
function log<T>(arg: T): T {
// arg 是个泛型变量，可能是任意类型
console.log(arg.length); // 报错，arg 不存在 length 属性
return arg;
}
但是我们想操作 T 类型的数组而不直接是 T。由于我们操作的是数组，所以 length 属性是存在的。而且，使用数组的其他方法也同样不会报错。
function log<T>(arg: T[]): T[] {
console.log(arg.length); // 不再报错
return arg;
}
// 第二种写法
function log<T>(arg: Array<T>): Array<T> {
}
这种方式可以让我们把泛型参数 T 当做泛型变量的类型的一部分使用，而不是整个类型，增加了灵活性。
泛型函数的类型
泛型函数的类型与非泛型函数的类型没什么不同，只是有一个类型参数在最前面，像函数声明一样：
第一种方式：箭头方式
function log<T>(arg: T): T {
return arg;
}
let myLog: <T>(arg: T) => T = log;
// <T>(arg: T) => T
我们也可以使用不同的泛型参数名，只要在数量上和使用方式上能对应上就可以。
<U>(arg: U) => U
第二种方式：对象字面量
{<T>(arg: T): T}
泛型接口
对象字面量的形式，让我们可以定义泛型函数的类型接口。
interface logFn {
<T>(arg: T): T
}
let myLog: logFn = log
接口泛型参数
定义泛型接口的另一种方式，我们可能想把泛型参数当作是整个接口的一个参数。这样我们就能清楚的知道使用的具体是哪个泛型类型（比如： Dictionary
interface logFn<T> {
(arg: T): T
}
let myLog: logFn<string> = log; //=> 此时必须要指定类型
这样就不再是描述泛型函数，而是把非泛型函数签名作为泛型类型一部分。 当我们使用 logFn 的时候，还得传入一个类型参数来指定泛型类型（这里是：number），锁定了之后代码里使用的类型。 对于描述哪部分类型属于泛型部分来说，理解何时把参数放在调用签名里和何时放在接口上是很有帮助的。
接口泛型参数默认值
我们可以给泛型参数一个默认值，后面使用时，如果没有指定，那么就会指定为默认值类型
interface logFn<T = string> {
(arg: T): T
}
let myLog: logFn = log; //=> 此时可以不指定类型
泛型类
除了泛型接口，我们还可以创建泛型类。 注意，无法创建泛型枚举和泛型命名空间。
泛型类看上去与泛型接口差不多。 泛型类使用（ <>）括起泛型类型，跟在类名后面。
官网上的这个例子是在非严格模式下运行的，严格模式会报错。
class GenericNumber<T> {
zeroValue: T;
add: (x: T, y: T) => T;
}
let myGenericNumber = new GenericNumber<number>(); // 在实例化的时候并没有给定初始值以及函数实现
myGenericNumber.zeroValue = 0;
myGenericNumber.add = function(x, y) { return x + y; };
另一个例子相对来说更加实用
class GetMin<T>{
arr:T[]=[];
add(ele:T){
this.arr.push(ele);
}
min():T{
var min=this.arr[0];
this.arr.forEach(function (value) {
if(value < min){
min = value;
}
});
return min;
}
}
let getMin = new GetMin<number>()
与接口一样，直接把泛型类型放在类后面，可以帮助我们确认类的所有属性都在使用相同的类型。
类有两部分：静态部分和实例部分。 泛型类指的是实例部分的类型，所以类的静态属性不能使用这个泛型类型。**
泛型约束
我们有时候想操作某类型的一组值，并且我们知道这组值具有什么样的属性。 前面我们想访问 arg 的 length 属性，但是编译器并不能证明每种类型都有 length 属性，所以就报错了。
function log<T>(arg: T): T {
console.log(arg.length); // 报错
return arg;
}
相比于操作 any 类型，我们想要限制函数去处理任意带有 length 属性的所有类型。 只要传入的类型有这个属性，我们就允许，就是说至少包含这一属性。 因此，我们需要列出对于 T 的约束要求。
我们定义一个接口来描述约束条件。 创建一个包含 length 属性的接口，使用这个接口和 extends 关键字来实现约束：
interface Lengthwise {
length: number;
}
function log<T extends Lengthwise>(arg: T): T {
console.log(arg.length); // 正确
return arg;
}
现在这个泛型函数被定义了约束，因此它不再是适用于任意类型：
log(3); // 报错，number 类型没有 length 属性
我们需要传入符合约束类型的值，必须包含必须的属性：
log({length: 10, value: 3});
在泛型约束中使用类型参数
你可以声明一个类型参数，且它被另一个类型参数所约束。 比如，现在我们想要用属性名从对象里获取这个属性值。 并且我们想要确保这个属性存在于对象 obj 上，因此我们需要在这两个类型之间使用约束。
function getProperty<T, K extends keyof T>(obj: T, key: K) {
return obj[key];
}
let x = { a: 1, b: 2, c: 3, d: 4 };
getProperty(x, "a"); // 正确
getProperty(x, "m"); // 报错，x 中不存在 m 属性
在泛型约束中使用类类型
在 TypeScript 使用泛型创建工厂函数时，需要引用构造函数的类类型。
function create<T>(c: {new(): T; }): T {
return new c();
}
一个更高级的例子，使用原型属性推断并约束构造函数与类实例的关系。在严格模式下，会报错，因为定义的属性都未初始化。
class BeeKeeper {
constructor(public hasMask:boolean) {
}
}
class ZooKeeper {
constructor(public nameTag:string) {
}
}
class Animal {
constructor(public numLegs: number) {
}
}
class Bee extends Animal {
constructor(numLegs: number, public keeper: BeeKeeper = new BeeKeeper(true)) {
super(numLegs)
}
}
class Lion extends Animal {
constructor(numLegs: number, public keeper: ZooKeeper = new ZooKeeper('a')) {
super(numLegs)
}
}
function createInstance<A extends Animal>(c: new (numLegs: number) => A, num: number): A {
return new c(num);
}
若有收获，就点个赞吧
0 人点赞
