TypeScript 是 JavaScript 的超集，它為語言新增了可選的靜態型別。 它帶有一個`編譯器`，可以將 TypeScript 程式碼轉換為 JavaScript，並在 JavaScript 執行的任何地方執行它，瀏覽器，NodeJS 等等。 最大的變化是 TypeScript 自帶了 Types。同時，這使得開發像您在 JavaScript 中可能習慣的通用程式碼變得更加困難，因為它是無型別的。

TypeScript 的目標是在我們的 IDE 中提供更好的整合，以幫助我們更早地發現錯誤。TypeScript 是 JavaScript 的擴充套件，用於提供型別資訊，並透過型別檢查和在許多支援程式碼編輯器（程式碼完成、內聯檔案等）中提供程式碼輔助來幫助進行錯誤檢測。 瀏覽器不能直接執行 TypeScript，需要一個轉譯步驟。

UI5 中的 TypeScript 是什麼？ UI5 是我們用來建立 UI5 應用程式的框架/SDK，也稱為 Fiori 應用程式。 當您使用框架、庫或 SDK 構建應用程式時，應使用 TypeScript 構建或提供定義檔案 (d.ts) 以支援 TypeScript。 從 2021年 4 月開始，SAP 提供 UI5 的 TypeScript 定義檔案。 這些檔案允許我們在 UI5 中使用 TypeScript！

UI5 使用 JSDoc 資訊來生成 TS 定義檔案。

UI5 為 UI5 API 提供生成的型別定義，讓 TypeScript 理解所有涉及的型別，因此它可以完成它的工作。 為 OpenUI5 和 SAPUI5 提供了這些定義，每個都有兩種不同的風格。 兩種口味分別是：

- 遺留型別定義（“ts-types”）允許（但不鼓勵）使用全域性物件，如 sap.ui.Button。 它們不再是我們關注的焦點並且得到的支援較少，但舊的應用程式專案可能仍然需要它們。
- 新的型別定義（“ts-types-esm”）需要將依賴項載入為 ES 模組，例如 import Button from “sap/ui/Button”，鼓勵使用現代 JavaScript 語言功能。

使用 TypeScript 開發的 SAP UI5 應用，在瀏覽器中的除錯也沒有任何障礙。

直接在 Chrome 開發者工具的 TypeScript 程式碼裡設定斷點：
![](https://img-blog.csdnimg.cn/img_convert/911ffec67d1d96c556eea15f4e255772.png)

可以直接在 dev tools 裡除錯 TypeScript 程式碼。

SAP UI5 的 TypeScript 實踐

相關文章