TypeScript的泛型基本使用

一、什么是泛型

泛型：是指在定义函数、接口或类的时候，不预先指定具体的类型，而在使用的时候再指定类型的一种特性。

二、基本使用

• 2.1 回顾之前其实就用过的泛型

let arr1:Array<number> = [1,2,3];
let arr2:Array<string> = ['a','b','c'];

这里的 Array<string> 就是使用了泛型
解释一下：

1. Array是ts的interface（接口）
   interface Array{}
2. 那么Array后面可以写number或者string，是怎么回事？
   其实是这样的：

interface Array<T>{

}

注意：这里写了一个T，这就解释了：不预先指定具体的类型，而在使用的时候再指定类型的一种特性。

• 2.2 函数泛型

function fun1<T>( option:T ): T{
    return option;
}
fun1<string>('123');
fun1<number>(123);

这里T是一个标识符，代表一个类型，当然也可以写成任意的（M，U等等），但是一般都写T
当然也可以有多个标识符

function fun2<T,M>( a:T,b:M ) :T {
    return a;
}
fun2<string,number>('1',2);

• 2.3 需求：函数的参数返回值必须有length属性

function fun3<T extends string>( arg:T ):number {
    return arg.length;
}
fun3<string>('str');

T extends string 表示泛型T必须是string的子类
但是如果需求是：普通字符串或者数组成员也是字符串的，就需要这样写了（联合声明）

function fun5<T extends string | string[]>( arg:T ){

}
fun5<string>('123');
fun5<string[]>(['a','b',]);

• 2.4 结合interface接口去使用

interface Idata{
    length:number;
}
function fun4<T extends Idata>( arg:T ){

}
fun4<string[]>(['a','b','c']);
fun4<string>('123');

• 2.5 泛型接口

interface Ires<T>{ 
    data:T;
    name:string;
    age:number;
}

let apple:Ires<string> = {
    data:'123',
    name:"张三",
    age:18
}

• 2.6 泛型结合class使用

class Person<T>{
    userName:T
    constructor( name:T ){
        this.userName = name;
    }
}
let person = new Person<string>('张三');