TypeScript 光速入門教程【DENO LSP】
為了快速入門 TypeScript，本文將提出幾個問題來導入深入地學習 TypeScript。
TypeScript 是什么？
TypeScript?更好嗎？
TypeScript 解決什么問題？
TypeScript 學習的路線安排。
TypeScript 是什么？
TypeScript 是一種腳本編程語言，是一種靜態(tài)類型語言，是一種強類型語言，是?JavaScript 腳本超集。作為一種編程腳本語言，它不可以用于開發(fā) Web 前端，或者 Web 后端，還可以開發(fā)桌面應用或者游戲開發(fā)，等等。
編程語言的本質(zhì)就是人類用于交流的一種工具，和人類使用的自然語言，英語、漢語或其它民族使用的語言沒有本質(zhì)區(qū)別。編程語言由于主要功能是用來指導計算機執(zhí)行邏輯功能，所以各種編程語言更具有完善的邏輯系統(tǒng)，不同語言理論上可以通過轉(zhuǎn)譯程序?qū)崿F(xiàn)相互之間的等價變換，就像人類日常使用翻譯功能進行交流。例如前端開發(fā)中使用的?Babel 轉(zhuǎn)譯工具，模塊打包工具等等。
比如，人類自然語言說：
請把評論打在樓下！
請投幣點贊收藏！
和以下編程腳本中的代碼沒有本質(zhì)具別，只還過編程更講究邏輯，而自然語言則不一定要符合特定邏輯。所以，人類很自然感覺到使用自然語言的輕松，而學習強邏輯的計算機語言有種身在約束叢林的感覺。
就以下代碼行而言，其邏輯包含：console 是一個對象，是一個類定義的實例，這種類型是腳本語言內(nèi)建的（用戶可以直接使用），它定義了一個方法叫做 log()，這個方法可以接收任意個參數(shù)并將這些參數(shù)打印到控制臺.
在編程世界中，有許多與人類自然語言世界相互沖突的語義，比如數(shù)學上 = 號表示兩個值相等，比如 1 = x，那么就知道 x 的值是 1。但是在編程邏輯中，由于計算機硬件體系結(jié)構(gòu)的存在，需要編程語言提供一種數(shù)據(jù)讀寫的基本操作，而這個操作表現(xiàn)在編程語言元素中，就是 = 號，比如以下給一個變量賦值，等號右側(cè)的稱為數(shù)據(jù)，data，左側(cè)稱為變量，variables。變量的本質(zhì)是一塊隨機分配的內(nèi)存，賦值操作就是將數(shù)據(jù)保存到分配好的內(nèi)存中。這個賦值過程和人類搬東西到指定位置具有等價意義：
以下提供幾種使用 TypeScript 腳本編程環(huán)境安裝指導：
TypeScript Playground 游樂場：可以直接在 Web 瀏覽器上運行腳本，但有功能約束，比如不能使用 fetch 這樣的 API 進行 HTTP 操作。https://www.typescriptlang.org/play
Node 環(huán)境：安裝 Node 開發(fā)環(huán)境，然后使用命令?npm install -global typescript?安裝?tsc 編譯器。https://nodejs.org/
Deno 環(huán)境：它本身集成了 TypeScript 解析器以及 V8 腳本引擎，直接下載 Deno 即可以開發(fā) TypeScript 應用，或者使用控制臺工具進行安裝。https://deno.land/manual@v1.36.1/getting_started/installation https://github.com/denoland/deno/releases/tag/v1.36.1
開發(fā)工具可選擇有很多，推薦兩個易用的編程工具：
Sublime Text 這是一款付費軟件，但作者沒有強制用戶付費，只會偶爾彈窗提醒。支持 LSP 智能代碼提示，可以搭配 Deno LSP 服務(wù)使用。https://www.sublimetext.com/?https://lsp.sublimetext.io/language_servers
Visual Studio Code 簡稱 VS Code，微軟開源團隊基于 TypeScript + Electron 開發(fā)的跨平臺開發(fā)工具。https://code.visualstudio.com/
關(guān)于 Sublime Text + Deno LSP 環(huán)境正確安裝后就可以非常方便地開發(fā) TypeScript 應用。環(huán)境配置可以參考?Opendocs Demo.md 中的 Sublime VSCode LSP 配置，注意 Deno 官方文檔提供的 LSP Settings 中缺少 selector 配置項，默認只提供 JavaScript 智能提示，不處理 TypeScript 腳本和 JSX 或 TSX，可以添加語言選擇器配置：
https://github.com/Jeangowhy/opendocs/blob/main/Deno.md
https://deno.land/manual@v1.36.1/getting_started/setup_your_environment
TypeScript?更好嗎？
網(wǎng)絡(luò)上信息太多了，什么水平都有。從而很容易引導初學者進行一個怪圈：“什么語言最好？”進入這種問題怪圈不說很大，只能說是毫無意義。這個世界沒有完美的事件。"大都好物不堅牢，彩云易散琉璃脆。"選擇最適合的工具做最恰當?shù)墓ぷ?，這就是于不完美中盡善。
TypeScript 更好的診斷是相對于 JavaScript 腳本的過度靈活從而帶來維護問題而言的，任何事，只要足夠自由，就會因為參與的人多了產(chǎn)生變壞的趨勢。因為人性天然不喜歡約束，JavaScript 則是支持人性的腳本。結(jié)果，帶來的這種壞可以用以下代碼表達：
為了運行 JavaScript 腳本，可以使用 Chrome 等瀏覽器提供的開發(fā)者工具，按 F12 即可以調(diào)出，在 Console 面板中就可以輸入代碼進行測試。
因為，JavaScript 使用的是動態(tài)類型，Dynamic Types，即腳本引擎實現(xiàn)源代碼中，使用的是一個數(shù)據(jù)結(jié)構(gòu)，這個結(jié)構(gòu)可以保存整數(shù)值、浮點數(shù)、字符串、布爾值等等不同的數(shù)據(jù)類型，并且會將相應的 API 導出到腳本解析器的運行時環(huán)境中供腳本使用。所以在一個腳本編程環(huán)境中，包含兩個基本構(gòu)成：解析器底層實現(xiàn)，通常是 C++ 或 C 言語實現(xiàn)；腳本運行時實現(xiàn)，提供一個環(huán)境運行腳本或?qū)⒌讓訉崿F(xiàn)的公開 API 導出到運行時，供腳本調(diào)用。
這也就是為何在以上代碼片段中，同樣是執(zhí)行 addup() 函數(shù)，但由于參數(shù) arg 接收到的數(shù)據(jù)類型差異而得到完全不同的結(jié)果。在 JavaScript 中，還可以使用 +"1" 這樣的表達式將字符串轉(zhuǎn)型為數(shù)值，比如?+"1"+1 就得到 2。
假設(shè)，一個項目隨著迭代，代碼會必然會增加，那么這種靈活性可能就是未來產(chǎn)生代碼“史山”的根源，即使是代碼寫作者本人，可能隔天就忘記了當時寫下代碼的本意。
TypeScript 解決什么問題？
JavaScript 一直以來的靈活性引出了一個編程語言類型的選擇問題：
選擇?Static type 還是?Dynamic type？
選擇 Strong? type 還是?Weak type？
這不是好與壞之間的問題，而是合適與不合適之間取舍的權(quán)衡。動態(tài)類型與靜態(tài)類型差別在于，動態(tài)類型在實現(xiàn)上使用的數(shù)據(jù)結(jié)構(gòu)可以兼容多種類型，在運行時可以按需要轉(zhuǎn)化類型，而靜態(tài)類型則不可以，聲明什么類型它就是固定的類型。
強類型與弱類型的差別在于對代碼的約束，強類型必需要未求數(shù)據(jù)類型一致才能達成邏輯操作，而弱類型不需要。
TypeSciprt 的出場就是動態(tài)類型與強類型結(jié)合，一方面有足夠的類型操作的靈活性，另一方法又提供了強類型的安全性，通過配合 Language Server Protocol (LSP) 提供的智能提示，可以讓你的代碼更健壯（我不想說魯棒）、更具有可維護性，對于開發(fā)大型項目而言，這無異是極大的優(yōu)勢！
TypeScript 在類型系統(tǒng)的設(shè)計上，是套完整的類型體操邏輯系統(tǒng)，類型可以通過各種邏輯操作進行組合拆分。一方面又引入了 any、unknow、never 等類型解決 JavaScript 遺留問題。
any 類型就是類型系統(tǒng)中存在的一切類型，或者沒有類型約束的類型。any 類型本質(zhì)上是類型系統(tǒng)的一個逃逸艙。作為開發(fā)者，這給了我們很大的自由：TypeScript 允許我們對 any 類型的值執(zhí)行任何操作，而無需事先執(zhí)行任何形式的檢查，就像在 JavaScript 中編程一樣。
TypeScript 3.0 引入頂級的 unknown 類型， 對照于 any，unknown 是類型安全的。任何值都可以賦給 unknown，但是當沒有類型斷言或基于控制流的類型細化時 unknown 不可以賦值給其它類型，除了它自己和 any 外。 同樣地，在 unknown 沒有被斷言或細化到一個確切類型之前，是不允許在其上進行任何操作的。
現(xiàn)在，讓我們來重新實現(xiàn)前面的 addup 函數(shù)：
以上就是 TypeScript 中的一個 Type-narrowing 類型收縮函數(shù)，通過邏輯條件判斷細分數(shù)據(jù)的類型。有些函數(shù)通過邏輯判斷輸入?yún)?shù)的類型，并返回一個布爾值表示確定參數(shù)是某類型，這種函數(shù)在 TypeScript 中叫做守衛(wèi)函數(shù) guard functions。
通過類型指示標注（變量或數(shù)據(jù)后面的冒號續(xù)寫的部分用來定義類型），所有變量或數(shù)據(jù)都擁有一個特定的類型標記，type notation，TypeScript 編譯器的主要功能就是確定在相同的類型標記這一條件達成的前提下進行各種邏輯操作。
JavaScript 中常用的 JSON 表達，因為在字面量，TypeScript 可以利用自動推斷功能獲得其類型，如下代碼變量 a 和 b 的類型可以自動根據(jù)右側(cè)的字面量推斷，所以可以省略 {id:number} 這個類型標記信息。每個類型都成成員的數(shù)據(jù)集合，當一個集合包含另一集合，那么就是兼容類型，如下 b 變量的類型兼容 a 變量的類型，所以 b 可以賦值給 a，但反過來不行。
TypeScript 學習的路線安排
以上就是 TypeScript 的最基礎(chǔ)的內(nèi)容，由于其類型系統(tǒng)的強大，以致官方文檔中直接使用類型體操?Type Manipulation 這樣的字眼。
https://www.typescriptlang.org/docs/
官方文檔內(nèi)容非常豐富，這里就學習 TypeScript 路徑給出一些指引信息：
了解 JavaScript/TypeScript 腳本編程的發(fā)展，以及 ECMAScript 腳本規(guī)范；
了解腳本的模塊化規(guī)范，如 Node 使用的 CommonJS 以及最新的 ES Modules 規(guī)范；
了解編譯器的使用與配置選項，特別是?Declaration Files (.d.ts) 類型聲明文件的使用；
了解 TypeScript 對 JavaScript 類型的兼容支持，以及各種流程控制關(guān)鍵字的使用；
了解 TypeScript 各種工具類型的使用，它們可以對類型進行靈活操作；
了解 TypeScript 的接口、類型、泛型等等功能的使用；
了解一些 TypeScript 應用的開發(fā)框架，比如開源的 VS Code，或者 Deno，或者 React 或 Vue 等前端框架。
TypeScript Cheat Sheets 是快速參考卡，可以快速了解 TypeScript 的功能概要：
https://www.typescriptlang.org/cheatsheets
https://www.typescriptlang.org/assets/typescript-cheat-sheets.zip
1. TypeScript Control Flow Analysis
https://www.typescriptlang.org/static/TypeScript%20Control%20Flow%20Analysis-8a549253ad8470850b77c4c5c351d457.png
2. TypeScript Interfaces
https://www.typescriptlang.org/static/TypeScript%20Interfaces-34f1ad12132fb463bd1dfe5b85c5b2e6.png
3. TypeScript Types
https://www.typescriptlang.org/static/TypeScript%20Types-ae199d69aeecf7d4a2704a528d0fd3f9.png
4. TypeScript Classes
https://www.typescriptlang.org/static/TypeScript%20Classes-83cc6f8e42ba2002d5e2c04221fa78f9.png
