TypeScript快速上手学习笔记-第十一篇——泛型

  • Post author:
  • Post category:其他




一、什么是泛型

软件工程中,我们不仅要创建一致的定义良好的API,同时也要考虑可重用性。 组件不仅能够支持当前的数据类型,同时也能支持未来的数据类型,这在创建大型系统时为你提供了十分灵活的功能。

在像C#和Java这样的语言中,可以使用泛型来创建可重用的组件,一个组件可以支持多种类型的数据。 这样用户就可以以自己的数据类型来使用组件。

在定义函数或者类时,如果遇到类型不明确的情况可以使用泛型。



二、函数中泛型的使用

这是是输入某个值,并将此制输出的过程,因为不清楚输入值的类型,所以可以使用泛型。泛型在调用的过程中,可以明确指定泛型,也可以不指定但TS会自动推断类型。

function fun<T>(a:T):T {
  return a;
}
//可以直接调用具有泛型的函数
console.log(fun(10));//不指定泛型,TS可以自动推断类型
console.log(fun<string>("ts"));//指定泛型

在这里插入图片描述



三、泛型可以指定多个

//泛型可以指定多个
function fn<T,K>(a:T,b:K):T {
  console.log(b);
  return a;
}
fn<String,number>("ts",10);
console.log(fn<String,number>("ts",10));



四、类中泛型的使用

这里Class类中name类型不明确,所以采用泛型。

class Class<T> {
  name:T;
  constructor(name:T){
    this.name=name;
  }
}
let c1=new Class<number>(10);
console.log(c1)

let c2=new Class<string>('js');
console.log(c2)

在这里插入图片描述



五、泛型可以继承其他类型

第一个是接口作为类型声明,其中泛型是接口的实现类

第二个泛型是number数字类型的继承类

interface Inters{
  length:number;
}
//这里用到了接口,其中泛型是接口的实现类
function f<T extends Inters>(a:T):number {
  return a.length;
}
console.log(f({length:10}))


function fu<T extends number>(a:T):T {
  return a;
}
console.log(fu(10))



版权声明:本文为qq_36288559原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。