新聞中心
TypeScript 是帶有類型語法的 JavaScript,它是一種建立在 JavaScript 基礎(chǔ)上的強(qiáng)類型編程語言。它內(nèi)置了常見的基礎(chǔ)類型,比如 string、number 和 boolean 等類型。

創(chuàng)新互聯(lián)于2013年成立,是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司,擁有項目成都做網(wǎng)站、網(wǎng)站設(shè)計網(wǎng)站策劃,項目實施與項目整合能力。我們以讓每一個夢想脫穎而出為使命,1280元曲阜做網(wǎng)站,已為上家服務(wù),為曲阜各地企業(yè)和個人服務(wù),聯(lián)系電話:18982081108
在這些類型的基礎(chǔ)上,我們就可以在聲明變量時,顯式聲明變量的類型。
let name: string = "阿寶哥"
那么在 TypeScript 中,類型到底是什么呢?其實你可以把類型理解成一系列值的集合。比如,你可以把數(shù)字類型看作是所有數(shù)字的集合,1.0、68 就屬于這個集合中,而 “阿寶哥” 就不屬于這個集合,因為它屬于字符串類型。
對于集合來說,最小的集合是空集,它不包含任何值。在 TypeScript 中與之對應(yīng)的類型是 never 類型。因為它的域是空的,所以沒有值可以賦給 never 類型的變量:
let num: never = 123; // Error
let name: never = "阿寶哥"; // Error
下一個最小的集合是包含單個值的集合。在 TypeScript 中與之對應(yīng)的類型是字面量類型,也稱為單元類型(Unit Type)。
type A = "A";
type B = "B";
let a: A = "A" // Ok
let b: B = "A" // Error
既然有單個值的集合,那么有兩個值的集合么?答案是有的,boolean 類型就是含有 true 和 false 值的集合。
此外,我們也可以使用操作符 | 把字面量類型組合成新的類型,也被稱為聯(lián)合類型。如果你對聯(lián)合類型還不了解的話,可以觀看 “搞懂 TypeScript 聯(lián)合類型的多個知識點(diǎn)” 這一期的視頻。
type AB = 'A' | 'B';
let a: AB= 'A' // Ok
let c: AB = "C" // Error
除了有限集合之外,我們前面介紹的 string 和 number 類型是屬于無限集合。此外,為了滿足不同的開發(fā)需求,TypeScript 還允許我們自定義類型。比如,這里使用 interface 關(guān)鍵字定義 3 種類型。
interface Vector1D { x: number; }
interface Vector2D { x: number; y: number; }
interface Vector3D { x: number; y: number; z: number; }其中 Vector1D 類型表示含有 x 屬性且屬性值的類型是 number 類型對象的集合。而 Vector2D 類型表示同時含有 x、y 屬性且屬性值的類型都為 number 類型對象的集合。
為了便于大家的理解,我們使用 JS 表達(dá)式來描述上述的規(guī)則:
v1 && typeof v1 === "object" && typeof v1.x === "number" // Vector1D
v2 && typeof v2 === "object" && typeof v2.x === "number" && typeof v2.y === "number" // Vector2D
其實對于上面的 3 種類型來說,我們也可以通過 extends 來擴(kuò)展已有的接口類型:
interface Vector1D { x: number; }
interface Vector2D extends Vector1D { y: number; }
interface Vector3D extends Vector2D { z: number; }在使用標(biāo)稱類型系統(tǒng)的語言中,比如 Java、C++。通常會使用 class 來描述對象類型,Vector1D 類會被稱為父類,Vector2D 類被稱為子類。
然而 TypeScript 為了更好地與使用鴨子類型的 JavaScript 相兼容,采用了結(jié)構(gòu)化類型系統(tǒng)。在該類型系統(tǒng)中 Vector1D 被稱為 SuperType,而 Vector2D 被稱為 SubType。
這種關(guān)系通常被畫成一個層次結(jié)構(gòu),但從集合的角度考慮,用文氏圖更合適。
文氏圖是在所謂的集合論數(shù)學(xué)分支中,在不太嚴(yán)格的意義下用以表示集合的一種草圖。它們用于展示在不同的事物集合之間的數(shù)學(xué)或邏輯聯(lián)系,尤其適合用來表示集合之間的“大致關(guān)系”。
這里 3 種類型之間關(guān)系對應(yīng)的文氏圖是這樣的。
現(xiàn)在我們來做個總結(jié),相比父類型 Vector1D,子類型 Vector2D 會包含更多的屬性,即描述的對象更為精確。Vector2D 子類型對應(yīng)的集合包含于 Vector1D 父類型對應(yīng)的集合中。
學(xué)完這些有什么用呢?讓我們來看個例子:
interface Vector1D { x: number; }
interface Vector2D { x: number; y: number; }
type SubtypeOf = T extends U ? true : false
type A = SubtypeOf // true
type B = SubtypeOf // true
type C = SubtypeOf // false 了解 TS 中的類型和所采用的結(jié)構(gòu)化類型系統(tǒng)是 TS 進(jìn)階的關(guān)鍵,值得你好好學(xué)習(xí)一番。如果有遇到不清楚的地方,歡迎隨時跟阿寶哥交流。你喜歡以這種形式學(xué) TS 么?
當(dāng)前題目:TypeScript中的類型到底是個啥?
文章起源:http://m.fisionsoft.com.cn/article/dhgshoi.html


咨詢
建站咨詢
