TypeScript泛型

泛型 generic，是泛指的类型。

在函数中使用泛型

/**
 * 泛型在函数中声明、使用
 */

// 可以定义多个泛型，指定多个参数的类型
const join = <T, S>(first: T, second: S) => {
  return `${first}${second}`;
};

join('1', 2);

const joinAs = <T>(first: T, second: T): T => {
  return first;
};

// Array<T> 和 T[]
const getArr = <T>(params: T[]) => {
  return params;
};

getArr(['abc', 'def']);

在类中使用泛型，使用 extends 约束泛型的类型。

interface Item {
  name: string;
}

class DataManager<T extends Item> {
  constructor(private data: T[]) {}

  getItem(index: number): string {
    return this.data[index].name;
  }
}

const data = new DataManager([{ name: 'Brady' }]);
data.getItem(0);

泛型作为具体的类型注解

const hello = <T>(params: T) => {
  return params;
};
const func: <T>(param: T) => T = hello;

使用 keyof 进行类型保护

interface Person {
  name: string;
  age: number;
  gender: string;
}

class Teacher {
  constructor(private info: Person) {}

  getInfo<T extends keyof Person>(key: T): Person[T] {
    return this.info[key];
  }
}

const teacher = new Teacher({
  name: 'Brady',
  age: 18,
  gender: 'male',
});

const result = teacher.getInfo('name');
console.log(result);