TypeScript泛型約束

2021-09-26 04:34:46 字數 1875 閱讀 4526

有了泛型之後，乙個函式或容器類能處理的型別一下子擴到了無限大，似乎有點失控的感覺。所以這裡又產生了乙個約束的概念。我們可以宣告對型別引數進行約束。

我們還拿上文中的student栗子來說，想訪問value的length屬性，但是編譯器並不能證明每種型別都有length屬性，所以就報錯了。

student = (value: t): t =>
相比於操作any所有型別，我們想要限制函式去處理任意帶有.length屬性的所有型別。 只要傳入的型別有這個屬性，我們就允許，就是說至少包含這一屬性。 為此，我們需要列出對於t的約束要求。為此，我們定義乙個介面來描述約束條件。 建立乙個包含.length屬性的介面，使用這個介面和extends關鍵字來實現約束：

inte***ce lengthdefine 


//這樣函式定義是編譯器就不會報錯了


student = (value: t): t =>
呼叫：

傳入的是字串能，裡面含有length屬性，能正常執行

let name: string = this.student(itemfun.getname('jack'));
如果傳入的是number型別的數字：

let age = this.student(10);


//argument of type '10' is not assignable to parameter of type 'lengthdefine'.
我們需要傳入符合約束型別的值，必須包含必須的屬性：

let name: string = this.student('jack');


let age = this.student();


age的型別推導結果：


(property) init.student: <>(value: ) =>
我們可以宣告乙個型別引數，且它被另乙個型別引數所約束。 比如，現在我們想要用屬性名從物件裡獲取這個屬性。 並且我們想要確保這個屬性存在於物件 obj上，因此我們需要在這兩個型別之間使用約束。

getproperty = (obj: t, key: k) => 


let obj = ;


console.log(this.getproperty(obj, 'a'));


'd'));


//argument of type '"d"' is not assignable to parameter of type '"a" | "b" | "c"'.ts(2345)
在typescript使用泛型建立工廠函式時，需要引用建構函式的類型別。比如：

function create(c: ): t
使用原型屬性推斷並約束建構函式與類例項的關係

class keeper1 


class keeper2 


class keeper3 


class childrenkeeper1 extends keeper3 


class childrenkeeper2 extends keeper3 


function createinstance(c: new() => a): a 


console.log(createinstance(childrenkeeper1));


//childrenkeeper1 {}


console.log(createinstance(childrenkeeper2));


//childrenkeeper2 {}

TypeScript泛型介面

以使用介面的方式來定義乙個函式需要符合的形狀 inte ce searchfunc let mysearch searchfunc source string,substring string 當然也可以使用含有泛型的介面來定義函式的形狀 inte ce createarrayfunc let cr...

TypeScript泛型學習

最近在跟著黃軼老師學習vue3.0框架的原始碼，遇到了難啃的點就是typescript的泛型反向推論。所以停下腳步找找資料加強學習typescript的泛型模組。首先簡單建立第乙個使用泛型的例子 test函式，這個函式會返回任何傳入它的值。不用泛型的情況function test arg numbe...

typescript學習（7） 泛型

1 型別引數 實現經典的資料結構binarysearchtree class nodenode表示這個類可以接收單個引數t，這個引數在類中的某個地方會使用到。使用方法 let numbernode new node let stringnode new node numbernode.right n...