跳到主要內容
黯羽輕揚每天積累一點點

TypeScript 簡介_TypeScript 筆記 1

免費2019-01-05#TypeScript#ts是js的语法糖#TypeScript history#TypeScript introduction#TypeScript教程#Strada and TypeScript

TypeScript 是 JavaScript 的語法糖！

一。背景

2010 – 微軟團隊開始開發

2012 – 第一個公開版本發布（TypeScript 0.8）

2013 – TypeScript 0.9 發布，支持泛型了

2014 – TypeScript 1.0 發布，Visual Studio 2013 預設支持 TypeScript 了。同時，源碼從 CodePlex 遷移到 Github

2017 – TypeScript 2.1 發布

2018 – TypeScript 3.2 發布

TypeScript 最初是個微軟內部項目，叫 Strada，致力於提升大型 JS 項目（當時內部需求是 Bing Maps、Office Web Apps 甚至 Windows 8 apps）的可靠性和可維護性。2010 年開始開發，2012 年 10 月發布了第一個開源版本，持續迭代至今

二。目標

Application scale JavaScript development is hard.

JavaScript 最初設計目標是作為一種腳本語言，缺少一些構建大型應用必備的基礎特性，如：

  • 靜態類型

  • 結構化機制（類、模塊、接口等）

類型上的缺陷導致很多錯誤要到運行時才能暴露出來，另一方面，缺少靜態類型也是 JS 編輯體驗差的主要原因，智能提示、自動補全等現代化編輯體驗都是從 Visual Studio 開始的：

  • 基於類型推斷的智能提示

  • 基於 JSDoc 的智能提示

  • 基於 TypeScript 聲明文件的智能提示

（摘自 JavaScript IntelliSense）

Application scale JavaScript development is hard, TypeScript makes it easier.

TypeScript 期望通過源碼轉譯的方式填補這些缺陷，給 JavaScript 添上 OOP 支持（Class、Interface 等），以及可選的靜態類型系統，在 ES5 時代（2010 年）建立起開發大型 JavaScript 應用的根基

此外，TypeScript 還給 JavaScript 帶來了一個重要的東西，d.ts 聲明文件：

Working with existing JavaScript libraries, declaration file can be written and maintained separately.

通過獨立的聲明文件讓現有 JavaScript 類庫也能擁有 TypeScript 的類型優勢，在提升 JavaScript 編輯體驗方面邁出了一大步

三。定位

TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.

有 3 個關鍵點：

  • typed：類型化的。給 JS 補充了（可選的）靜態類型

  • superset of JavaScript：超集。兼容 JS，支持混用，現有的 JavaScript 類庫可以直接使用

  • compiles to plain JavaScript：編譯到原生 JS。從 JavaScript 開始，以 JavaScript 結束

具體的：

  • 從 JavaScript 開始：超集意味著所有 JavaScript 代碼都是 TypeScript，語法語義都與 JavaScript 一致，複製粘貼就可以開始了

  • 提供可選的靜態類型、類與模塊：類型不僅讓 JavaScript 開發能夠使用高效的開發工具和實踐（如靜態檢查和代碼重構），而且不會帶來運行時的性能損耗（靜態類型僅在編譯時存在）

  • 以 JavaScript 結束：TypeScript 編譯產生地道的原生 JavaScript，因此支持最前沿的 JavaScript 特性，並且能在任何支持 ES3+ 的宿主環境中運行

可以認為TypeScript 是 JavaScript 的語法糖：

TypeScript is a syntactic sugar for JavaScript. TypeScript syntax is a superset of ECMAScript 2015 (ES2015) syntax. Every JavaScript program is also a TypeScript program.

（摘自 Introduction | TypeScript Language Specification）

像類型補丁一樣，能與 JavaScript 世界完美融合，這才是 TypeScript 生命力之所在：

Starts and ends with JavaScript, and optional static types, classes, modules.

並且，這一點從 TypeScript 公開發布（2012 年末）至今（2019 年初）都沒有變過

四。設計原則

追求：

  • 靜態識別出那些可能有錯的部分

  • 為大段代碼提供結構化機制

  • 不給編譯產物增加運行時開銷

  • 輸出整潔、地道、可讀的 JavaScript 代碼

  • 實現一種可組合、易推理的（easy to reason about）語言

  • 永遠和 ES 規範保持一致

  • 保留所有 JavaScript 代碼的運行時行為

  • 避免添加���達式級的語法特性

  • 一致的、完全可擦除的結構化類型系統

  • 成為跨平台開發工具

  • 從 TypeScript 1.0 起不要引入重大破壞性變動

拒絕：

  • 完全模仿現有語言的設計，應該以 JavaScript 的行為和開發者的意願作為語言設計指南

  • 優化程序的運行時性能，應該忠實輸出原生 JavaScript 代碼，而不刻意優化

  • 完善的或「可證明正確的」類型系統，而應該在正確性和生產力之間取得平衡

  • 提供一端到另一端的（封閉）構建管道，應該讓系統具有可擴展性，讓編譯器適用於更複雜的構建工作流

  • 添加或依賴運行時類型信息，或根據類型系統的結果很長不同的代碼，應該鼓勵不依賴運行時信息（run-time metadata）的編程模式

  • 額外提供運行時功能或類庫，應該用 TypeScript 來描述現有類庫

  • 引入可能會讓用戶感到意外的行為，應該適當考慮其他常用語言所採用的模式

五。特性

類型系統

  • 是 JavaScript 類型的形式化：JavaScript 類型動態系統的靜態表示

  • 提供類型推斷與結構化類型：實際上不必都給標註上類型（類型推斷能夠解決一部分）

  • 能夠配合現有 JavaScript 類庫使用：聲明文件可以獨立編寫維護

  • 不是可證明的類型安全（provably type safe）：類型只反映意圖，並不提供保證

最重要的是，靜態類型僅在編譯時存在：

In the JavaScript output, all type annotations have been erased.

例如：

// TypeScript
function f(s: string) {
  return s;
}
// 編譯得到的 JavaScript，類型標註統統擦掉
function f(s) {
  return s;
}

另外，TypeScript 雖然提供了靜態類型系統，並在編譯時嚴格檢查，但並不像 [Haskell 類型系統](/articles/類型-haskell 筆記 3/) 一樣可證明，可推理。因此，TypeScript 類型系統更多地只是作為 JavaScript 的靜態類型補丁，像註釋一樣體現「意圖」，並不保證安全

甚至編譯錯誤並不阻塞代碼生成，類型檢查報錯只是提醒這裡可能存在問題：

You can use TypeScript even if there are errors in your code. But in this case, TypeScript is warning that your code will likely not run as expected.

類與模塊

  • 可擴展的應用結構化機制：類、模塊和接口支持定義組件間的明確聯繫

  • 遵從最新標準：類、模塊和箭頭函數語法都與 ES6 標準一致

  • 也支持業界主流模塊系統：如 CommonJS 和 AMD 模塊

注意，模塊的語法規則與 ES 標準一致，但在加載機制上存在差異，具體見 Module Resolution

六。生態

參考資料

評論

暫無評論，快來發表你的看法吧

提交評論