TypeScript ——JavaScript 的超集

Typescript並不是一個完全新的語言,它是JavaScript的超集,爲Javascript的生態增加了類型機制,並最終將代碼編譯爲純粹的Javascript代碼

Typescript簡介

Typescript由Microsoft(算上Angular2的話加上Google)開發維護的一種開源編程語言。支持Javascript的所有語法和語義,同時作爲EACMAScript的超集提供一些額外的功能,如類型檢測和更豐富的語法。

使用Typescript的原因

Javascript是一門弱類型語言,變量的數據類型具有動態性,只有執行的時候才能確定變量的類型,這種後知後覺的認錯方法會讓開發者成爲調試大師,但無益於編程能力的提升,還會降低開發效率。Typescript的類型機制可以有效的杜絕變量類型引起的誤用問題,而且開發者可以根據情況來確定是嚴格限制變量類型還是寬鬆限制。不過,添加類型限制後,也有副作用:增大了開發者的學校曲線,增加了設定類型的開發時間,但這些付出相對於代碼的健壯性和可維護性,都是值得的。

類型註釋是Typescript的內置功能之一,文本編輯器可以對代碼執行更好的靜態分析,這樣,我們就可以通過自動編譯工具的幫助,在編寫代碼時減少錯誤,提高生產力

接下來對其特有的知識點進行簡單的概括總結

數據類型

String類型

一個保存字符串的文本,類型聲明爲string。類型聲明可大寫可小寫


Boolean類型

boolean有兩個值,true 或 false


Number類型


Array類型

數組是Array類型,數組其實是一個集合,我們還需要指定這個集合中元素的類型。Array<type> or type[] 指定元素類型的語法


Enums類型

列出所有可用值,一個枚舉的默認初始值是0。你可以調整一開始的範圍


Any類型

any是默認的類型,其類型的變量允許任何類型的值


Void類型

Javascript沒有空值void的概念,在Typescript中,可以用void表示沒有任何返回值的函數


函數

爲函數定義類型

我們可以給每個參數添加類型之後再爲函數返回值添加類型,但是實際編程中一般省略爲函數返回值添加類型,因爲Typescript能夠根據返回語句自動推斷出返回值類型。下面函數add,add2,add3的效果是一樣的,其中add3函數是函數完整類型


可選參數和默認參數

Javascript裏每個參數都是可選的,可傳可不傳,不傳的時候就是undefined。在Typescript裏我們可以在參數名旁使用?實現可選參數的功能。比如,我們想讓lastname是可選的:


如果帶默認值的參數出現在必須參數前面,調用函數時必須明確傳入undefined值來獲得默認值。上面的例子讓firstname是帶默認值的參數:


傳統的Javascript程序使用函數和基於原型的繼承來創建可重用的組件,但對於熟悉使用面向對象的程序員講有些棘手,因爲面向對象使用的是基於類的繼承並且對象是有類構建出來的。使用Typescript允許開發者使用這些特性,並且編譯後的Javascript可以在所有主流瀏覽器和平臺上運行,而不需要等到下個Javascript版本


我們在引用任何一個類成員的時候都用了this。表示我們訪問的是類的成員。其實這本質上還是ES6的知識,知識在ES6的基礎上多上了對this字段和引用參數類型聲明

繼承


從例子中可以看到其實也是es6的基礎上添加了類型聲明,不過這裏多了一個知識點——公共、私有、受保護的修飾符.typescript裏成員默認的是public;當成員被標記爲private時,它就不能在聲明它的類的外部訪問;protected修飾符和private修飾符的行爲很相似,但有一點不同,protected成員在派生類中仍然可以訪問

存儲器

Typescript支持通過getters/setters來截取對對象成員的訪問,可以有效的控制對對象成員的訪問。

對於存儲器有一下幾點需要注意:

1.存取器要求編譯器設置爲ECMAScript 5或更高

2.只帶有get不帶有set的存取器自動被推斷爲readonly。這在從代碼生成的.d.ts文件時是有幫助的,因爲利用這個屬性的用戶會看到不允許改變它的值


接口

接口

Typescript的核心原則之一是對值所具有的結構進行類型檢查。在Typescript裏接口的作用就是爲這些類型命名和我們自己的代碼或第三方的代碼定義契約

nameType接口實際上就相當於一個名字,同樣也是一個對象,有一個name屬且屬性的類型是string。只要傳入的對象滿足這兩個條件就是被允許的。類檢測器不會去檢查屬性的順序,只有相應的屬性存在、類型符合就可以

可選屬性

帶有可選屬性的接口和普通的接口定義差不多,知識在可選屬性名字定義的後面加一個?符號。可選屬性的好處之一是可以對可能存在的屬性進行預定義,好處之二是可以捕獲引用了不存在的屬性時的錯誤


函數類型

接口能夠用來描述Javascript中對象擁有的各式各樣的外形,除了描述普通對象外,接口也可以描述函數類型。定義函數類型的接口就像是一個只有參數列表和返回值類型的函數定義。參數列表裏每個參數都需要名字和類型。定義完成後,我們可以像使用其他接口一樣使用這個函數類型的接口


可索引類型

與使用接口描述函數類型相似,我們也可以描述哪些能夠“通過索引得到”的類型,比如a[10] 或 ageMap['belle'].可索引類型具有一個索引簽名,它描述了對象索引的類型,以及相應的索引返回值類型。


類類型

與c# 或 Java 裏接口的基本作用一樣,Typescript也能夠用它來明確的強制一個類去符合某種契約。我們可以在接口中描述一個方法,在類裏面實現它,如同下面的setTime方法一樣:


繼承接口

和類一樣,接口也可以相互繼承,這樣就能夠從一個接口裏複製成員到另一個接口裏,可以更靈活地將接口分割到可重用的模塊裏


模塊

Typescript 與 ECMAScript 2015一樣,任何包含頂級import或者export的文件都被當成一個模塊。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章