TypeScript泛型

TypeScript泛型

泛型(Generic)

定义一个函数或类时,有些情况下无法确定其中要使用的具体类型(返回值、参数、属性的类型不能确定);

此时泛型便能够发挥作用;

举个例子:

function test(arg: any): any{
    return arg;
}
  • 上例中,test函数有一个参数类型不确定,但是能确定的时其返回值的类型和参数的类型是相同的;
  • 由于类型不确定所以参数和返回值均使用了any,但是很明显这样做是不合适的:
  • 首先使用any会关闭TS的类型检查,其次这样设置也不能体现出参数和返回值是相同的类型;

泛型函数

创建泛型函数

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

这里的<T>就是泛型;

  • T是我们给这个类型起的名字(不一定非叫T),设置泛型后即可在函数中使用T来表示该类型;

  • 所以泛型其实很好理解,就表示某个类型;

  • 那么如何使用上边的函数呢?

使用泛型函数

方式一(直接使用):
test(10)

使用时可以直接传递参数使用,类型会由TS自动推断出来,但有时编译器无法自动推断时还需要使用下面的方式

方式二(指定类型):
test<number>(10)

也可以在函数后手动指定泛型;

函数中声明多个泛型

可以同时指定多个泛型,泛型间使用逗号隔开:

function test<T, K>(a: T, b: K): K{
  return b;
}

test<number, string>(10, "hello");

使用泛型时,完全可以将泛型当成是一个普通的类去使用;

泛型类

类中同样可以使用泛型:

class MyClass<T>{
  prop: T;

  constructor(prop: T){
      this.prop = prop;
  }
const mc = new MyClass<string>(name:'孙悟空')

泛型继承

除此之外,也可以对泛型的范围进行约束

interface MyInter{
  length: number;
}

function test<T extends MyInter>(arg: T): number{
  return arg.length;
}

使用T extends MyInter表示泛型T必须是MyInter的子类,不一定非要使用接口类和抽象类同样适用;

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 介绍 软件工程中,我们不仅要创建一致的定义良好的 API,同时也要考虑可重用性。组件不仅能够支持当前的数据类型,同...
    24KBING阅读 369评论 0 1
  • 介绍软件工程中,我们不仅要创建一致的定义良好的API,同时也要考虑可重用性。 组件不仅能够支持当前的数据类型,同时...
    年轻人多学点阅读 179评论 0 1
  • 泛型 软件工程中,我们不仅要创建定义良好且一致的 API,同时也要考虑可重用性。 组件不仅能够支持当前的数据类型,...
    罗彬727阅读 627评论 0 0
  • 软件工程中,我们不仅要创建一致的定义良好的API,同时也要考虑可重用性。 组件不仅能够支持当前的数据类型,同时也能...
    2o壹9阅读 628评论 0 48
  • 首先介绍一下泛型的概念 泛型程序设计(generic programming)是程序设计语言的一种风格或范式。泛型...
    这个前端不太冷阅读 2,017评论 0 1