范型
泛型可以理解为宽泛的类型,通常用于类、函数、接口。
定义一个函数或类时,有些情况下无法确定其中要使用的具体类型(返回值、参数、属性的类型不能确定),此时泛型便能够发挥作用
举个例子:
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);