TypeScript 范型的基本用法

范型

泛型可以理解为宽泛的类型，通常用于类、函数、接口。

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

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

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

常见的范型变量

• T (Type)    表示类型
• K (Key)     表示对象中键的类型
• V (Value)   表示对象中值的类型
• E (Element) 表示元素类型
• 可以自己定义其他的范型变量（例如下文中的U）

范型函数

// function声明定义范型
function name<T>(name: T): T {
  return name;
}
// 箭头函数定义范型
// const name = <T,>(name: T): T => name;
console.log(name<string>('yq'));

// 多个范型变量 自定义范型变量
function getInfo<T, U>(name: T, age: U): { name: T; age: U } {
  return {
    name,
    age,
  };
}
console.log(getInfo<string, number>('yq', 21));

范型类

class MyClass<V, K> {
  arr: Array<V | K> = [];

  public set add(v: V | K) {
    this.arr.push(v);
  }

  public get getArr(): Array<V | K> {
    return this.arr;
  }
}

const MyClass1 = new MyClass<string, number>();
MyClass1.add = 1;
MyClass1.add = 'yq';
console.log(MyClass1.getArr);

范型接口

// 范型函数接口
interface ConfigFn{
    <T>(value:T):T;
}
 
const getData:ConfigFn=function<T>(value:T):T{
    return value;
}
console.log(getData('yq'))

// 范型接口
interface MyInterface<T> {
  value: T;
}

const obj: MyInterface<string> = { value: 'yq' };
console.log(obj.value);