【TypeScript教程】01—如何安裝用于使用 TypeScript 的開發(fā)環(huán)境
為什么 TypeScript 比普通 JavaScript 更有優(yōu)勢。 了解 TypeScript 的真正含義及其背后的工作原理。 使用 TypeScript 及其豐富的功能，如類型、類、接口、模塊等。
基本的 JavaScript 知識。如果你想學(xué)習(xí) JavaScript，請查看JavaScript 教程。 ECMAScript 2015 或 ES6知識現(xiàn)在
現(xiàn)在，我們開始進(jìn)入今天的內(nèi)容。
TypeScript 簡介
TypeScript 的主要目標(biāo)是：
向 JavaScript 引入可選類型。
實現(xiàn)未來 JavaScript 的計劃功能，即當(dāng)前 JavaScript 的 ECMAScript Next 或 ES Next。
1) TypeScript 提高您的工作效率，同時幫助避免錯誤
類型通過幫助你避免許多錯誤來提高生產(chǎn)力。通過使用類型，你可以在編譯時捕獲錯誤，而不是讓它們在運(yùn)行時發(fā)生。
以下函數(shù)將兩個數(shù)字x和相加y：
function add(x, y) {return x + y;}：
如果你從 HTML 輸入元素獲取值并將它們傳遞給函數(shù)，你可能會得到意想不到的結(jié)果：
let result = add(input1.value, input2.value);console.log(result); // result of concatenating strings
例如，如果用戶輸入10and 20，add()函數(shù)將返回1020，而不是30。
原因是input1.valueandinput2.value是字符串，而不是數(shù)字。當(dāng)你使用運(yùn)算符+將兩個字符串相加時，它會將它們連接成一個字符串。
當(dāng)你使用 TypeScript 顯式指定參數(shù)的類型時，如下所示：
function add(x: number, y: number) {return x + y;}
在這個函數(shù)中，我們將數(shù)字類型添加到參數(shù)中。該函數(shù)add()將只接受數(shù)字，而不接受任何其他值。
當(dāng)你調(diào)用該函數(shù)時，如下所示：
let result = add(input1.value, input2.value);
如果你將 ...的TypeScript 代碼編譯為 JavaScript，TypeScript 編譯器將發(fā)出錯誤。因此，你可以防止錯誤在運(yùn)行時發(fā)生。
2) TypeScript 將未來的 JavaScript 帶到今天
TypeScript 支持 ES Next 中為當(dāng)前 JavaScript 引擎計劃的即將推出的功能。這意味著你可以在 Web 瀏覽器（或其他環(huán)境）完全支持它們之前使用新的 JavaScript 功能。
每年，TC39 都會為 ECMAScript 發(fā)布幾個新特性，ECMAScript 是 JavaScript 的標(biāo)準(zhǔn)。功能提案通常經(jīng)歷五個階段：
階段 0：稻草人
第1階段：提案
第 2 階段：草稿
第3階段：候選
第 4 階段：完成
而且 TypeScript 通常支持處于第 3 階段的功能。
TypeScript 設(shè)置
你需要設(shè)置以下工具才能開始使用 TypeScript：
Node.js – Node.js 是運(yùn)行 TypeScript 編譯器的環(huán)境。請注意，你不需要了解 node.js。
TypeScript 編譯器——一個 Node.js 模塊，將 TypeScript 編譯成 JavaScript。如果你對 node.js 使用 JavaScript，則可以安裝該ts-node模塊。它是 node.js 的 TypeScript 執(zhí)行和 REPL
Visual Studio Code 或 VS Code——是一個支持 TypeScript 的代碼編輯器。強(qiáng)烈推薦使用 VS Code。但是，你可以使用自己喜歡的編輯器。
如果你使用 VS Code，你可以安裝以下擴(kuò)展來加快開發(fā)過程：
Live Server – 允許你使用熱重載功能啟動開發(fā)本地服務(wù)器。
安裝 Node.js
要安裝 node.js，請按照以下步驟操作：
轉(zhuǎn)到node.js 下載頁面。
下載適合你的平臺（即 Windows、macOS 或 Linux）的 node.js 版本。
執(zhí)行下載的 node.js 包或執(zhí)行文件。安裝非常簡單。
通過在 macOS 和 Linux 上打開終端或在 Windows 上打開命令行并鍵入命令來驗證安裝node -v。如果你看到你下載的版本，那么你已經(jīng)成功地在你的計算機(jī)上安裝了 node.js。
安裝 TypeScript 編譯器
要安裝 TypeScript 編譯器，請在 macOS 或 Linux 上啟動終端并在 Windows 上啟動命令提示符，然后鍵入以下命令：
npm install -g typescript
安裝完成后，你可以鍵入以下命令來檢查當(dāng)前的 TypeScript 編譯器版本：
tsc --v
它應(yīng)該像這樣返回版本：
Version 4.0.2
請注意，你的版本可能比此版本更新。
如果你使用的是 Windows 并收到以下錯誤：
'tsc' is not recognized as an internal or external command,operable program or batch file.
...然后你應(yīng)該將以下路徑添加C:\Users\<user>\AppData\Roaming\npm到PATH變量中。請注意，你應(yīng)該將 更改<user>為你的 Windows 用戶。
要ts-node全局安裝模塊，請從 macOS 和 Linux 上的終端或 Windows 上的命令提示符運(yùn)行以下命令：
npm install -g ts-node
安裝 VS 代碼編輯器
要安裝 VS Code，請按照以下步驟操作：
到VS Code 下載頁面。
下載適合你的操作系統(tǒng)（Windows、macOS 或 Linux）的最新版本的 VS Code
執(zhí)行下載的軟件包或安裝程序文件以啟動安裝向?qū)?。安裝過程也非常簡單。
啟動 VS 編輯器。
你將看到如下圖所示的 VS Code：
要安裝Live Server擴(kuò)展，請執(zhí)行以下步驟：
單擊“擴(kuò)展”選項卡以查找 VS Code 的擴(kuò)展。
鍵入實時服務(wù)器以進(jìn)行搜索。
單擊安裝按鈕以安裝擴(kuò)展。
到這里，今天的教程就已經(jīng)結(jié)束了，最后，我再總結(jié)一下：
首先，我們介紹了什么是TypeScript 。
其次，介紹了TypeScript的優(yōu)勢。
最后，介紹了如何設(shè)置 TypeScript 開發(fā)環(huán)境。
感謝你的閱讀，祝編程快樂！
學(xué)習(xí)更多技能
請點擊下方公眾號
