泛型-Generics
先来看第一个泛型的例子:identity函数,这个函数会返回任何传入它的值。你可以把这个函数当成是echo命令
不用泛型,函数可能是下面这样:
function identity(arg: number): number {
return arg;
}
或者用any类型来定义函数:
function identity(arg: any): any {
return arg;
}
使用any类型会导致这个函数可以接收任何类型的arg参数,然后传入的类型与返回的类型应该是相同的,如果我们传入一个数字,我们只知道任何类型的值都有可能被返回
所以我们需要一种方法使返回值的类型与传入参数的类型是相同的,这里我们使用了类型变量:
function identity<T>(arg: T): T {
return arg;
}
T帮助我们捕获用户传入的类型,之后我们可以使用这个类型,并使用T当做返回值类型,那么我们就知道参数类型和返回值类型是相同的了。
使用泛型变量
如果我们想获取T类型的length,那么上面的写法会出错,因为输入的可能是一个数字类型没有length。那么就需要以下写法,像定义数组一样去定义:
function loggingIdentity<T>(arg: T[]): T[] {
console.log(arg.length);
return arg;
}
也可以这样去实现:
function loggingIdentity<T>(arg: Array<T>): Array<T> {
console.log(arg.length);
return arg;
}
约束泛型
先来看下面一个例子:
泛型T不一定包含属性length,我们可以给他传入任意类型,当然有些不包括length属性,所以就会报错
function echoWithArr<T>(arg: T): T {
console.log(arg.length)
return arg
}
这个时候我们就可以使用下面这种写法,利用前面讲过的 interface ,约束里面必须包含length属性,这样传入就没有任何问题,只能传入包含length属性的类型
interface IWithLength {
length: number;
}
function echoWithLength<T extends IWithLength>(arg: T): T {
console.log(arg.length)
return arg
}
echoWithLength('str')
const result3 = echoWithLength({length: 10})
const result4 = echoWithLength([1, 2, 3])