天天看點

TypeScript入門-泛型

泛型

要建立一個可重用的元件,其中的資料類型就必須要相容很多的類型,那麼如何相容呢,TypeScript提供了一個很好的方法:泛型

要相容多種資料格式,可能會有人想到any,即

使用any存在一個問題,有可能傳入的值和傳回的值不是同一種值,例如,傳入數字,但是不确定傳回的是什麼值

要解決這個問題,我們需要引入類型變量-一種特殊的變量,隻用于表示類型不表示值

給identify添加了類型變量T,用來捕獲傳入值的類型,然後将傳回值的類型也設定為T,就實作了傳入值和傳回值為同一類型值的需求

我們把identify這個函數叫做泛型,因為它适用于所有類型,并且不會有any類型存在的問題

使用泛型的方法有兩種:

  1、傳入所有的參數,包括類型參數

  2、利用類型推論--即編譯器會根據傳入的參數自動地幫助我們确定T的類型

在泛型中,我們要合理正确的使用泛型變量T,要牢記T表示任何類型

錯誤使用:

在泛型中我們使用了length這個屬性,但是T代表任何類型,是以有可能是number,而number是沒有length屬性的,是以會報錯

如果想要使用length這個屬性,我們可以建立數組

泛型函數的類型與非泛型函數的類型沒什麼不同,隻是有一個類型參數在最前面,像函數聲明一樣:

從上面的代碼中可以看出也可以使用不同的泛型參數名,隻要在數量上和使用方式上能對應上就可以

當然也可以把泛型參數當做一個接口的參數,這樣就可以知道這個接口具體用的是那種類型

泛型類看上去與泛型接口差不多。 泛型類使用( <code>&lt;&gt;</code>)括起泛型類型,跟在類名後面。

在前面的泛型變量中遇到了一個問題,就是在泛型中調用參數的length時,如果參數沒有Length屬性會報錯,而使用泛型限制,就是隻有滿足一定的條件才可以使用這個泛型

為此,我們定義一個接口來描述限制條件。 建立一個包含 <code>.length</code>屬性的接口,使用這個接口和<code>extends</code>關鍵字還實作限制:

當傳入123時,沒有length屬性,就報錯,而傳入字元串qwe時則完全正确

繼續閱讀