系統學習 TypeScript(一)——認識 TypeScript

程式設計三昧發表於2022-02-21

前言

TypeScript 很流行,這是前端從業者眾所周知的事。

TypeScript 很好用,仁者見仁智者見智。但是,很多大型前端框架都使用 TypeScript 進行了重構。

為了不落伍,我也需要系統的學習一下 TypeScript 相關知識了,今天是第一課。

TypeScript 的概念及意義

TypeScript 是由微軟開發的自由和開源的程式語言。通過在 JavaScript的 基礎上新增靜態型別定義構建而成。TypeScript 通過 TypeScript 編譯器或 Babel 轉譯為 JavaScript 程式碼,可執行在任何瀏覽器,任何作業系統。

  • TypeScript 是新增了型別系統的 JavaScript,適用於任何規模的專案。
  • TypeScript 是一門靜態型別、弱型別的語言。
  • TypeScript 是完全相容 JavaScript 的,它不會修改 JavaScript 執行時的特性。
  • TypeScript 可以編譯為 JavaScript,然後執行在瀏覽器、Node.js 等任何能執行 JavaScript 的環境中。
  • TypeScript 擁有很多編譯選項,型別檢查的嚴格程度由你決定。
  • TypeScript 可以和 JavaScript 共存,這意味著 JavaScript 專案能夠漸進式的遷移到 TypeScript。
  • TypeScript 增強了編輯器(IDE)的功能,提供了程式碼補全、介面提示、跳轉到定義、程式碼重構等能力。
  • TypeScript 擁有活躍的社群,大多數常用的第三方庫都提供了型別宣告。
  • TypeScript 與標準同步發展,符合最新的 ECMAScript 標準(stage 3)

TypeScript 可以編譯出純淨、 簡潔的 JavaScript 程式碼,並且可以執行在任何瀏覽器上、Node.js 環境中和任何支援 ECMAScript 3(或更高版本)的 JavaScript 引擎中。

TypeScript 有更多的規則和型別限制,程式碼具有更高的預測性、可控性,易於維護和除錯;對模組、名稱空間和麵向物件的支援,更容易組織程式碼開發大型複雜程式。

TypeScript 的編譯步驟可以捕獲執行之前的錯誤。

image-20220221182629919

TypeScript 的主要特徵

從上面的概念和意義部分可以看出,TypeScript 的特徵比較多,這裡我們就幾個主要特性進行分析。

TypeScript 是靜態型別

我們都知道,JavaScript是一門解釋型語言,沒有編譯階段,它只有在執行時才會進行型別檢查。

而 TypeScript 與它相反,因為 TypeScript 在執行前還要經過被編譯成 JavaScript 的過程,它在編譯階段就就能確定每個變數的型別,這種語言的型別錯誤往往會導致語法錯誤。

比如,在 JavaScript 中:

let foo = 1;
foo.split(' ');
// Uncaught TypeError: foo.split is not a function
// 執行時會報錯(foo.split 不是一個函式),造成線上 bug

而在 TypeScript 中:

let foo = 1;
foo.split(' ');
// Property 'split' does not exist on type 'number'.
// 編譯時會報錯(數字沒有 split 方法),無法通過編譯

TypeScript 是弱型別

在這一點上,TypeScript 和 JavaScript 的表現是一致的,具體是指資料型別可以發生隱式轉換 ,看以下一段程式碼:

console.log("1" + 1);
// // 列印出字串 '11'

不管是在 TypeScript 中還是 JavaScript 中,輸出結果都是一樣的。

全域性安裝 TypeScript

npm install -g typescript

總結

今天就主要認識一下 TypeScript,知道它是什麼、有什麼用,接下來就要學習它該怎麼樣了。

~

~ 本文完,感謝閱讀!

~

學習有趣的知識,結識有趣的朋友,塑造有趣的靈魂!

大家好,我是〖程式設計三昧〗的作者 隱逸王,我的公眾號是『程式設計三昧』,歡迎關注,希望大家多多指教!

相關文章