Typescript 泛型-CSDN博客

本文链接：https://blog.csdn.net/qq_20765533/article/details/139280852

文章目录

泛型

泛型

定义一个函数或类时，有些情况下无法确定其中要使用的具体类型（返回值、参数、属性的类型不能确定），此时泛型便能够发挥作用。

function identity(arg: number): number {
	return arg;
}

function identity(arg: any): any{
 	return arg;
}

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

使用泛型

这里的<T>就是泛型，T 是我们给这个类型起的名字（不一定非叫 T），设置泛型后即可在函数中使用 T 来表示该类型。所以泛型其实很好理解，就表示某个类型。

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

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

方式一（直接使用）：
使用时可以直接传递参数使用，类型会由 TS 自动推断出来，但有时编译器无法自动推断时还需要使用下面的方式
```
  test(10)
```
方式二（指定类型）：
也可以在函数后手动指定泛型
```
 test<number>(10)
```

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

  function test<T, K>(a: T, b: K): K{
      return b;
  }
  
  test<number, string>(10, "hello");

泛型类型

泛型函数和普通函数的区别，就是函数名后面加一个泛型参数。至于这个参数名字可以任意取值。

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

let myIdentity: <U>(arg: U) => U = identity;

泛型变量

泛型参数可以用作变量，创建其它类型数据限制，比如泛型数组。

function loggingIdentity<T>(arg: T[]): T[] {
    console.log(arg.length);  // Array has a .length, so no more error
    return arg;
}

泛型约束

除此之外，也可以对泛型的范围进行约束。
以下示例表示只有拥有 .length 属性的数据类型才可以用作泛型类型。

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

泛型类

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

类中同样可以使用泛型：

  class MyClass<T>{
      prop: T;
  
      constructor(prop: T){
          this.prop = prop;
      }
  }

class GenericNumber<T> {
    zeroValue: T;
    add: (x: T, y: T) => T;
}

let myGenericNumber = new GenericNumber<number>();
myGenericNumber.zeroValue = 0;
myGenericNumber.add = function(x, y) { return x + y; };

let stringNumeric = new GenericNumber<string>();
stringNumeric.zeroValue = "";
stringNumeric.add = function(x, y) { return x + y; };
console.log(stringNumeric.add(stringNumeric.zeroValue, "test"));

泛型接口

泛型函数

// 用泛型定义函数限制接口
interface GenericIdentityFn {
    <T>(arg: T): T;
}

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

let myIdentity: GenericIdentityFn = identity;

把泛型参数当作整个接口的一个参数

interface GenericIdentityFn<T> {
    (arg: T): T;
}

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

let myIdentity: GenericIdentityFn<number> = identity;