typeScript中的泛型

75 阅读1分钟

泛型是指在使用时才定义类型,可以使类型像参数一样定义,主要解决类、接口、函数的复用性,让他们可以处理多种类型。

1. 泛型的定义和使用

// 普通函数定义
function getArr<T>(value:T,num:number):T[]{
    return new Array(num).fill(value)
}
// 使用
getArr<number>(2,3)//[2,2,2]
// 箭头函数定义
let getArr = <T>(v:T,num:number):t[]=>{
     return new Array(num).fill(v)       
}
getArr(2,3); // [2,2,2]

2. 泛型的继承

因为泛型的类型是不确定的,但是有些情况下只有定的数据类型才拥有的属性。对于这种情况希望在书写时就能够给出提示,这时就需要用到泛型的继承来实现。

eg:当我们读取length获取长度时,如果是数值(number)类型的将会得到undefined,因为数值上面并没有length属性。

function getLenght(value:any):number{
    return value.length;
}
console.log(getLenght(123)) // undefined

当使用泛型的继承的时候就可以提前检测出传入的数据是否符合类型

function  getLenggth<T extends string>(value:T):number {
    return value.length;
}
// console.log(getLength(123)) // 编译时就能检测出来
// console.log(getLength("123")) // 此时就没问题

解释:因为"123"是属于string的,而123是数值类型的不是string所以会报错。

也可以使用类型别名的方式定义一个类型,然后让其继承。

type getLenght = {
    length: number
}
function getLength<T extends getLenght>(value:T):number {
     return value.length
 }
console.log(getLength("123")) // 同样是可以的

也可以使用混合继承的方式指定多个

function getLength<T extends getLenght | any[]>(value:T):number {
    return value.length
}
console.log(getLength([1,2,3,"2"])) // 同样是可以的

\