• 編寫一個聯(lián)合類型 Demo

function join(first: string | number, second: string | number) {
  return `${first}${second}`;
}
join("baidu", ".com");

join 方法接受兩個參數(shù) first、second,參數(shù)有可能是字符串類型，也有可能是數(shù)字類型。方法里為了保證都可以使用，所以我們只作了字符串的基本拼接。

但是現(xiàn)在如果想改成 ：first參數(shù)如果傳的是字符串類型，要求second也傳字符串類型.同理，如果是number類型，就都是number類型。需要用到- 泛型

• 初始泛型概念-generic

泛型：[generic - 通用、泛指的意思],那最簡單的理解，泛型就是泛指的類型。

泛型的定義使用<>（尖角號）進行定義的，比如現(xiàn)在給join方法一個泛型，名字就叫做ABC(起這個名字的意思，就是你可以隨便起一個名字，但工作中要進行語義化。),后邊的
參數(shù).

function join<ABC>(first: JSPang, second: JSPang) {
  return `${first}${second}`;
}
join < string > ("baidu", ".com")
//如果是number
join < number > (1, 2);

• 泛型中數(shù)組的使用

//第一種寫法
function myFun<ANY>(params: ANY[]) {
  return params;
}
myFun < string > ["123", "456"];

//第二種寫法
function myFun<ANY>(params: Array<ANY>) {
  return params;
}
myFun < string > ["123", "456"];

使用<T>來作泛型的表示

• 多個泛型的定義(一般第一個泛型用T,第二個用P代表)

function join<T, P>(first: T, second: P) {
  return `${first}${second}`;
}
join < number, string > (1, "2");

• 泛型的類型推斷
  泛型也是支持類型推斷的，比如下面的代碼并沒有報錯，這就是類型推斷。

function join<T, P>(first: T, second: P) {
  return `${first}${second}`;
}
join(1, "2");

• 一個基本的類

class SelectGirl {
  constructor(private girls: string[]) {}
  getGirl(index: number): string {
    return this.girls[index];
  }
}

const selectGirl = new SelectGirl(["aa", "bb", "cc"]);
console.log(selectGirl.getGirl(1)); // bb

• 初始類的泛型

class SelectGirl<T> {
  constructor(private girls: T[]) {}
  getGirl(index: number): T {
    return this.girls[index];
  }
}

const selectGirl = new SelectGirl() < string > ["aa", "bb", "cc"];

console.log(selectGirl.getGirl(1));

-泛型中的繼承

interface Girl {
  name: string;
}

class SelectGirl<T extends Girl> {
  constructor(private girls: T[]) {}
  getGirl(index: number): string {
    return this.girls[index].name;
  }
}

const selectGirl = new SelectGirl([
  { name: "aa" },
  { name: "bb" },
  { name: "cc" },
]);
console.log(selectGirl.getGirl(1));