安裝後就可以使用命令來編譯用TypeScript編寫的.ts文件成為.js文件，這樣讓編寫的文件在瀏覽器上運行。編譯的過程可以通過配置來選擇使用ES5或者ES6的語法來編譯，這點還是很方便強大的。

支持 TypeScript 的文本編輯器

此外隨著TypeScript的日益流行，現在也出現了更多本身支持或者通過插件支持 TypeScript 語法、智能提示、糾錯、甚至是內置編譯器的文本編輯器和IDE。

• Visual Studio Code– 微軟另外一個輕量級的開源代碼編輯器。內置支持TypeScript。

• Sublime Text的官方免費插件。

• WebStorm的最新版本帶有內置支持。

• 其他包括Vim，Atom，Emacs等。

靜態類型

TypeScript 一個很獨特的特徵是支持靜態類型。意思就是可以聲明變量的類型，（因此）編譯器就可以確保賦值時不會產生類型錯誤。如果省略了類型聲明，TypeScript 將會從代碼中自動推測出正確的類型。

這有個例子。任意變量，函數自變量或者返回值在初始化時都可以定義自己的類型

因為 JavaScript 是弱類型語言（即不聲明變量類型），因此 TypeScript 編譯為 JavaScript 時，（變量類型的聲明）全部被移除：

然而，如果我們試著輸入非法的語句，tsc 會警告代碼裡有錯誤。例如：

以下是一些最常用的數據類型：

• Number (數值類型) – 所有數字都是數值類型的，無論是整數、浮點型或者其他數值類型都相同。

• String（字符串類型） – 文本類型，就如 vanilla JS 字符串一樣可以使用單引號或者雙引號。

• Boolean（布爾類型） – true 或者 false，用 0 和 1 會造成編譯錯誤。

• Any（任意類型） – 該類型的變量可以設定為字符串類型，數值類型或者任何其他類型。

• Arrays（數組類型） – 有兩種語法：my_arr: number[];或者my_arr: Array

• Void （空類型）- 用在不返回任何值的函數中。

Interfaces 接口

接口通常會根據一個對象是否符合某種特定結構來進行類型檢查。通過定義一個接口我們可以命名一個特殊的組合變量，確保它們會一直一起運行。當轉譯成 JavaScript 時，接口會消失 – 它們唯一的目的是在開發階段裡起到輔助的作用。在下面的例子中我們定義了一個簡單的接口來對一個函數自變量進行類型檢查：

屬性的順序並不重要。我們只需必要的屬性存在並且是正確的類型。如果哪裡有遺漏，類型錯誤，或者命名不同的話，編譯器都會報警告信息。

類

在搭建大型規模的應用程序時，尤其是在 Java 或 C# 當中，許多開發者會優先選擇面向對象編程。TypeScript 提供一個類系統，和 Java、C# 中的非常相似，包括了繼承，抽象類，接口實現，setters/getters 方法等。

值得一提的是由於最新的 JavaScript 更新（ECMAScript 2015），這些類對於 vanilla JS 來說是原生的，並且在沒有 TypeScript 的情況下也可以使用。這兩種實現方式非常相似但是也有不同的地方，TypeScript 更加嚴格一些。

繼續上面的 food的 例子，這裡有一個簡單的TypeScript類：

只要寫過一點 Java 或者 C# ，就會發現TypeScript和它們在語法上非常相似。繼承也是一樣：

泛型

泛型（Generics）是允許同一個函數接受不同類型參數的一種模板。相比於使用 any 類型，使用泛型來創建可複用的組件要更好，因為泛型會保留參數類型。

一段簡單的腳本例子，傳入一個參數，返回一個包含了同樣參數的數組。

第一次調用函數的時候，我們將類型手動設置成字符串。第二次及以後再次調用的時候就不必這樣做了，因為編譯器會判斷傳遞過什麼參數並且自動決定哪種類型最適合。雖然不是強制性的，但是由於編譯器在眾多複雜環境中確定正確類型的時候可能會失敗，所以每次都傳入類型是好的做法。

TypeScript 本身是開源的，同時其架構設計的也很優秀，提供了大量的API來供開發人員來擴展其功能，目前仍在積極開發和持續演變中。

隨著各大廠商對ES6標準的不斷支持，TypeScript 和 JavaScript 都會有屬於他們自己的舞臺，讓前端技術能夠適應越來越複雜的應用成為可能。

如果你有什麼疑問或者問題，請關注我並給我私信，我將在第一時間給予回覆！

閱讀更多 軟件先生 的文章

關鍵字: 標準 ECMAScript 三分鐘