使用 TypeScript 建立 JavaScript 應用程式

中級
學生
開發人員
Visual Studio Code

TypeScript 提供 JavaScript 的所有功能,再加上額外的一層,也就是 TypeScript 類型系統。 在此學習路徑,了解如何使用 TypeScript 進行 JavaScript 開發,以協助您建立更健全的程式碼、減少執行時間類型的錯誤、利用新式功能,在 JavaScript 中提供使用,並更妥善地與開發小組合作。

必要條件

  • 熟悉基本的 HTML 和 JavaScript ES6/2015,包括:
    • 條件
    • 函式
    • 影響範圍
    • 陣列
    • 迴圈
    • 迭代器
    • 物件
    • 類別
    • 單元
  • 安裝的軟體:

此學習路徑中的課程模組

此課程模組會為您介紹 TypeScript 語言、建立的原因,以及如何將其用於 JavaScript 開發。 您也會設定 TypeScript 開發環境以用於未來的練習。

JavaScript 是動態類型的語言。 雖然這可讓宣告變數變得很簡單,但在某些情況下可能會導致非預期的結果。 TypeScript 中的靜態型別系統可讓您描述物件的形狀、提供完善的文件,並允許 TypeScript 驗證您的程式碼是否正常運作。 在 TypeScript 中,命名空間、類別、屬性、函式、變數和其他語言實體的宣告會將型別與這些實體建立關聯。 型別形成和語言實體相關聯的方式取決於實體的種類。 此課程模組介紹一些可用型別,並示範如何與變數產生關聯。 稍後的課程模組會檢查介面、函式和類別如何使用靜態型別。

JavaScript 不支援介面,因此 JavaScript 開發人員可能也不曾接觸這些介面。 在 TypeScript 中,您可以如同在傳統物件導向程式設計中一般地使用介面。 您也可以使用介面來定義物件類型,這是此課程模組的主要重點。

如果您知道如何以 JavaScript 撰寫函式,就會知道如何在 TypeScript 中撰寫函式。 但是 TypeScript 會將一些新功能新增至標準 JavaScript 函式,以便更容易使用。

TypeScript 中的類別會藉由新增 TypeScript 特定功能 (例如類別成員的類型註釋、存取修飾詞,以及能夠指定必要或選擇性參數),以擴充 ES6 功能。 使用 TypeScript 的另一個優點是您可以使用它來開發類別,然後將其編譯為可在所有主要瀏覽器和平台上運作的 JavaScript (視需要)。

泛型是可在整個程式碼基底中定義和重複使用的程式碼範本。 泛型提供了一種方法,告訴函式、類別或介面您要在呼叫時使用的型別。

TypeScript 提供兩種方式來組織您的程式碼命名空間和模組。 此學習課程模組會為您介紹 TypeScript 中的模組 (在舊版中稱為外部模組。)

TypeScript 提供兩種方式來組織程式碼 - 命名空間和模組。 此課程模組說明如何使用命名空間來組織 TypeScript 程式碼。