巴州网站建设库尔勒网站建设钟爱网络福州seo视频
泛型使用
- 组件不仅能够支持当前的数据类型，同时也能支持未来的数据类型。就需要使用泛型。
- 使用泛型就不会丢失类型信息，使用
any会丢失类型信息。
function identity<T>(arg: T): T {return arg;
}
identity 添加了类型变量T, T 捕获用户传入的类型，就可以使用T类型。可以看到T作为函数参数的类型和返回值类型。如果当用户传入number类型，那么identity函数的参数类型和返回值类型都是number。
确定泛型类型
- 第一种方法，传入确定的类型
let output = identity<string>('myString'); // 明确泛型为string
- 第二种方法：类型推论
let output = identity('myString'); // typescript 自动推断出类型为 string
使用泛型变量
函数的参数使用变量，函数体必须正确的使用这些参数。
function loggingIdentity<T>(arg: T): T {console.log(arg.length); // Error: T doesn't have .lengthreturn arg;
}
T 是泛型，可以是任何类型，传入的类型可能没有 length属性，所以报错。
- 修复方案
function loggingIdentity<T>(arg: T[]): T[] {console.log(arg.length); // Error: T doesn't have .lengthreturn arg;
}
泛型类型
泛型函数的类型与非泛型函数的类型没什么不同，只是有一个类型参数在最前面。
function identity<T>(arg: T): T {return arg;
}let myIdentity: <T>(arg: T) => T = identity;
可以使用不同的泛型参数名，只要数量上和使用方式上能对应上就可以。
function identity<T>(arg: T): T {return arg;
}let myIdentity: <U>(arg: U) => U = identity;
使用带有调用签名的对象字面量来定义泛型函数：
function identity<T>(arg: T): T {return arg;
}let myIdentity: {<T>(arg: T): T} = identity;
带有调用签名的对象字面量，改成接口
interface GenericIdentityFn {<T>(arg: T): T;
}function identity<T>(arg: T): T {return arg;
}let myIdentity: GenericIdentityFn = identity;
一个泛型参数作为整个接口的一个参数
interface GenericIdentityFn<T> {(arg: T): T;
}function identity<T>(arg: T): T {return arg;
}let myIdentity: GenericIdentityFn<number> = identity;
泛型类
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;
};
类有两部分：静态部分和实例部分，泛型类指的是实例部分的类型，所以类的静态属性不能使用泛型类型。
泛型约束
给定泛型一些属性的约束，传入的类型必须拥有这些属性。
interface Lengthwise {length: number;
}// 泛型T给定了 Lengthwise 类型约束，传入的值，必须包含 lengthwise 类型的属性
function loggingIdentity<T extends Lengthwise>(arg: T): T {console.log(arg.length);return arg;
}
在泛型里使用类类型
使用泛型创建工厂函数时，需要引用构造函数的类类型
function create<T>(c: {new (): T}): T {return new c();
}
原型属性推断并约束构造函数与类实例的关系
class BeeKeeper {hashMask: boolean;
}class ZooKeeper {nametag: string;
}class Animal {numLegs: number;
}class Bee extends Animal {keeper: BeeKeeper;
}class Lion extends Animal {keeper: ZooKeeper;
}function createInstance<A extends Animal>(c: new () => A): A {return new c();
}// createInstance(Lion).keeper.nametag;
// createInstance(Bee).keeper.hashMaskconst lion = createInstance(Lion);
lion.numLegs = 4;
lion.keeper.nametag = '狮子';const bee = createInstance(Bee);
bee.numLegs = 4;
bee.keeper.hashMask = true;