1、什么是泛型?
泛型是指在定义函数、接口或类的时候,不预先指定具体的类型,而在使用的时候在指定类型的一直特征。
2、为什么要使用泛型
因为any会在调试中丢失很多的信息,所以我们不建议使用any,这个时候应该有更好的解决方案,那就是泛型。
3、简单的泛型使用
function getT(arg:any):any{
return arg
}
getT('1') //这个时候如果接收一下的话
const a = getT('1') //a 的类型就是 any
相当于
const a : any //但是如果你 typeof a 还是和 getT的参数保持一致
深入解释: 我们在传参的时候可以看出我们传的是String类型的参数,但是返回的a还是any,这就说明类型丢失了。 但是我们又想传入的参数和返回的参数的类型保持一致,这个时候就需要泛型帮我们解决了
function echo<T>(arg:T):T{
return arg
}
const str:string = '你好啊泛型 我是 String 类型的值'
const result = echo(str) // 这个时候就相当于是 const result : string 了
解释:在echo函数的声明中我们在函数名后使用<>声明了一个名为T类型的类型变量,并把入参和返回类型都声明为T,在调用的时候传入类型为string的参数,IDE会自动进行类型推断,推断出返回值类型也为string。
当然我们在调用的时候也可以主动为泛型赋值
function echo<T>(arg:T):T{
return arg
}
const str:string = '你好'
const res = echo<string>(str) //这样的话 返回的就是 const res:string 了
4、泛型的约束
当我们使用泛型时,在代码中访问被泛型类型的变量时,容易出现各种各样的报错,这个时候我们需要对泛型进行约束,告知代码被赋予泛型类型的变量拥有些什么。
function echo<T>(arg:T):T{
console.log(arg.length) // 这个时候会报错 (类型T上不存在属性length)
return arg
}
这里我们让泛型继承一个接口,对泛型进行约束
interface echoLength {
length:number
}
function echo<T extends echoLength>(arg:T):T{
console.log(arg.length)
return arg
}
var a:string = '你'
var result = echo(a)
console.log(result.length); // 2 长度为2
//当然传入的参数 在js本身中 也需要拥有 length这个属性 ,你不能传入一个 number的属性去length
5、泛型在类中的使用
class Stack<T>{
private data = []
push(item:T){
return this.data.push(data)
}
pop(){
const last = this.data.pop()
return last.length
}
}
const stack = new Stack<string>('I AM STRING ')
//这个方法和泛型的基本使用差不多,方法一样
6、泛型在接口中的使用
我们在很多的情况下会用到类似于{key,value}这样的数据结构,比如select,radio等等的option中,而key,value的类型可能并不固定,我们可以使用接口和泛型,将类型抽象出来。
interface keypair<T,U>{
key:T,
value:U
}
const kp1:keypair<number,string> = {key:1,value:'1'}
const kep2:keypair<number,number> = {key:1,value:1}
从上面的例子可以看出,接口中使用泛型的方法和在类在函数中的使用方法类似, 在声明接口时去声明两个泛型变量,在使用接口的时候传入具体类型即可。
总结:没有真实项目开发过,许多的问题一定是没法发现的,只能边用边遇到问题,在解决吧。