TypeScript中泛型的使用

對於typescript中的泛型，你可以把它理解為引數化型別，把每個引數的型別也封裝成引數的形式，而這個封裝的方式，就是泛型。

如果我們要編寫乙個函式，接收兩個引數，這兩個引數可能都為string型別或者都為number型別，最後做拼接操作。

對於這個功能，其實通過上面的聯合型別以及型別保護就能實現，但是，我們再分析一下這個功能的條件，「這兩個引數可能都為string型別或者都為number型別」，思考一下，我們能不能在呼叫的時候就直接告訴這個函式傳進來的引數型別呢？答案是可以的，泛型就能實現這個功能。

function f(one: t, two: t) $`
}f("ok", "fine")

這裡再多提一嘴，由於typescript具有型別推斷功能，所以我們在呼叫函式的時候甚至不需要寫泛型中引數，比如這樣：

f("ok", "fine")

當然，我們也可以定義多個泛型。

function f(one: t, two: p) $`
}f("ok", 2)

建立乙個類，順帶把建構函式寫好，兩個引數：

class student 
}

引數化引數的型別，實現對類的泛型初始化，之後實現乙個簡單的呼叫。

class student
}const stu = new student("小白", 21)

接著上面student的例子，現在有乙個這樣的資料結構：每乙個student都**於乙個person介面，這個介面中有乙個name屬性（string型別），現在我們需要把乙個student物件中的name取出來。

首先我們完善一下inte***ce以及getter函式的部分：

inte***ce person 
class student
get getname() 
}

現在的介面person和student類還是沒有任何關聯的，接下來我們使用泛型的繼承將person中的name傳遞給student中的name，大家在理解這一點的時候注意兩個name的大小寫，小寫的是類中定義的，大寫的是介面傳遞給類的。

inte***ce person 
class student
get getname() 
}

最後呼叫一下。

const stu = new student()

如果大家觀察的仔細，我們會發現我們在傳遞建構函式的時候直接傳遞進去了乙個物件，是帶著大括號的。原因其實很簡單，我們可以將person看作是乙個要傳進去的那個物件的描述，通過extends語句將這個描述傳遞給student中的name屬性，最後在我們初始化物件的時候，我們看似初始化的是乙個物件，但其實我們初始化的還是建構函式中的那個name。

這個地方一開始看的我懵逼了很久，最後我照著別人的**寫了乙個例項出來，又反覆看了幾遍就發現能看懂了。

TypeScript中泛型的使用

TypeScript中的泛型

TypeScript泛型約束

TypeScript泛型介面

TypeScript中泛型的使用

TypeScript中的泛型

TypeScript泛型約束

TypeScript泛型介面

相關推薦