一. 泛型是什么

泛型就是用一个东西表示“广泛”的类型。

举例如下:returnIt函数的作用是给什么返回什么

1
2
3
4
5
6

function returnIt<T>(arg: T): T{
return arg;
}

let s = returnIt<string>('hi')

如果用any来写的话,无法确保参数类型和返回值类型相同

二. 泛型的使用

泛型数组
1
2
3
4
5
6
7
8

function returnIt<T>(array:T[]):T[]{
return array.concat(array);
}

returnIt([1,2,3])

returnIt<number>([1,2,3])
泛型接口
1
2
3
4
5
6
7
8
9
10
interface Addany<T>{
(a:T,b:T):T
}

let stringAdd:Addany<string> = function(a:string,b:string):string{
return a+b;
}
let numberAdd:Addany<number> = function(a:number,b:number):number{
return a+b;
}
泛型类
1
2
3
4
5
6
7
8
9
10
class GenericNumber<T>{
zeroValue : T;
add : (x:T,y:T)=>T
}

let myGeneric = new GenericNumber<number>()
myGeneric.zeroValue = 0;
myGeneric.add = function(a:number, b:number){
return a+b
}
泛型函数加类
1
2
3
4
5
6
7
8
9
10

class Human{

}

function create<T>(c:{new ():T}){
return new c()
}

let s = create<Human>(Human)

二. 泛型约束是什么

就是给泛型添加一些约束,使其可以拓展一些方法;

因为我们有时候对泛型传过来的值是有一定要求的,所以要添加一些约束

1
2
3
4
5

function returnIt<T>(arg: T): T{
console.log(arg.length) // error
return arg;
}

添加约束之后

1
2
3
4
5
6
7
8
9

interface HasLength{
length: number
}

function returnIt<T extends HasLength>(arg: T): T{
console.log(arg.length) // no error
return arg;
}

下例说明添加泛型约束以后,所传参数就必须有length和name属性了;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

interface HasLength{
length: number;
name : string
}

function returnIt<T extends HasLength>(arg: T): T{
console.log(arg.length) // no error
return arg;
}

returnIt({
length : 1,
name : '123'
})