一、“前浪” JavaScript

2007年 Jeff Atwood 在他的博客里提出了著名的 Atwood 定律，即“任何能夠用 JavaScript 實(shí)現(xiàn)的應(yīng)用系統(tǒng)，最終都必將用 JavaScript 實(shí)現(xiàn)。”

JavaScript 的強(qiáng)大毋庸置疑，十余年的時(shí)間早已驗(yàn)證了這一點(diǎn)：語法結(jié)構(gòu)簡單、萬物皆可對象、前后端通吃、單線程……這些特點(diǎn)使它幾乎無處不在。

正因?yàn)樗膽?yīng)用領(lǐng)域之廣，對這門語言的安全性、可維護(hù)性等方面的要求日漸拔高，可偏偏“萬物皆可對象”的特點(diǎn)，又使得它注定是一門動(dòng)態(tài)弱類型的編程語言，于是乎使用 JavaScript的工程師們，他們經(jīng)常會(huì)碰到這么一種情況：

<script>function getLength(str) {return str length;}console.log("1.正在的代碼執(zhí)行");console.log("2.開始函數(shù)");getLength("abc"); //正確的調(diào)用getLength(); //錯(cuò)誤的調(diào)用(IDE并不會(huì)報(bào)錯(cuò))//當(dāng)上面的代碼報(bào)錯(cuò)后，后續(xù)所有的代碼都無法正常執(zhí)行了console.log("3.調(diào)用結(jié)束"); <script>

在 JavaScript 里編譯以上代碼時(shí)，不會(huì)出現(xiàn)報(bào)錯(cuò)，可在瀏覽器運(yùn)行時(shí)，就會(huì)出現(xiàn)以下畫面↓↓

出現(xiàn)這一情況的原因就在于：JavaScript 對我們傳入的參數(shù)，不會(huì)進(jìn)行任何限制。

二、“后浪” TypeScript

今年的五四，B站的《后浪》刷了屏，一周了熱度也沒算完全消退。

盡管 JavaScript 這一“前浪”著實(shí)優(yōu)秀，卻也有著不可避免的限制和缺陷，在這種情況下，“后浪” TypeScript 出現(xiàn)了，它既能完美融合 JavaScript 已有的優(yōu)點(diǎn)和特點(diǎn)，也在此基礎(chǔ)上，又增加了類型約束。

為什么說 JS 工程師遇到了 TypeScript 會(huì)擁有超能力呢？接下來我們將通過課程《TypeScript 基礎(chǔ)入門》的第一章，讓你初步了解“后浪” TypeScript。

三、初見 TypeScript

TypeScript 是 JavaScript 的一個(gè)超集，他們兩個(gè)之間有非常深入的聯(lián)系，所以在學(xué)習(xí) TypeScript 之前，你需要學(xué)習(xí) JavaScript 相關(guān)教程。在本實(shí)驗(yàn)我們將會(huì)對 TypeScript 進(jìn)行簡單的介紹并初步使用它。

知識點(diǎn)

• TypeScript 簡介
• 為何選擇 TypeScript
• 安裝使用 TypeScript

TypeScript 簡介

什么是TypeScript？

TypeScript 是一種由微軟開發(fā)的自由和開源的編程語言。它是 JavaScript 的一個(gè)超集，而且本質(zhì)上向這個(gè)語言添加了可選的靜態(tài)類型和基于類的面向?qū)ο缶幊獭?/p>

它擴(kuò)展了 JavaScript 的語法，所以任何現(xiàn)有的 JavaScript 程序可以不加改變的在 TypeScript 下工作。TypeScript 是為大型應(yīng)用之開發(fā)而設(shè)計(jì)，而編譯時(shí)它產(chǎn)生 JavaScript 以確保兼容性。

TypeScript 與 JavaScript 的區(qū)別

TypeScript 是 JavaScript 的超集，擴(kuò)展了 JavaScript 的語法。

TypeScript 可處理已有的 JavaScript 代碼，并只對其中的 TypeScript 代碼進(jìn)行編譯。

TypeScript 文件的后綴名 .ts （.ts，.tsx，.dts），JavaScript 文件是 .js。

在編寫 TypeScript 的文件的時(shí)候就會(huì)自動(dòng)編譯成 js 文件。

用一張表格來更清晰的觀察兩者的區(qū)別：

為何選擇 TypeScript

TypeScript 增加了代碼的可讀性和可維護(hù)性

新增了其他語言的語法，比如 Class（類）、Interface（接口）、Generics(泛型)、Enums(枚舉）等。

TypeScript 擁抱了 ES6 規(guī)范

兼容很多第三方庫，即使第三方庫不是用 TypeScript 寫的，也可以編寫單獨(dú)的類型文件供 TypeScript 讀取。

TypeScript 擁有活躍的社區(qū)

更值得一提的是，TypeScript 在開發(fā)時(shí)就能給出編譯錯(cuò)誤，而 JavaScript 錯(cuò)誤則需要在運(yùn)行時(shí)才能暴露。作為強(qiáng)類型語言，你可以明確知道數(shù)據(jù)的類型，代碼可讀性極強(qiáng)，幾乎每個(gè)人都能理解。TypeScript 被很多業(yè)界大佬使用，像 Asana、Circle CL 和 Slack 這些公司都在用 TypeScript。

安裝使用 TypeScript

打開終端 terminal 輸入全局安裝命令：

cnpm install -g typescript

新建一個(gè)文件index.ts，輸入以下內(nèi)容：

console.log("hello world");

var a: string = “2”; //這是ts寫法，暫時(shí)不需要掌握，后續(xù)會(huì)講到
在終端輸入tsc index.ts編譯文件，編譯成功則會(huì)生成一個(gè)同名的 js 文件。

生成的 js 文件里則將 ts 語法轉(zhuǎn)換成了 js 語法。

四、總結(jié)

本小節(jié)我們學(xué)習(xí)了以下知識點(diǎn)：

• TypeScript 簡介
• 為何選擇 TypeScript
• 安裝使用 TypeScript

我相信你已經(jīng)對 TypeScript 有了一個(gè)初步了解，接下來我們將會(huì)對 TypeScript 進(jìn)行進(jìn)一步學(xué)習(xí)。后續(xù)還有以下章節(jié)等著你來掌握：

• 基本數(shù)據(jù)類型
• 接囗
• 類（Class）
• 函數(shù)
• 模塊
• 命名空間

登陸實(shí)驗(yàn)樓官網(wǎng)，搜索《JavaScript 基礎(chǔ)入門》、《TypeScript 基礎(chǔ)入門》，一起擁抱 TypeScript，做一個(gè)擁有超能力的JS 工程師！

總結(jié)

以上是生活随笔為你收集整理的当 JS 工程师遇到了 TypeScript 会发生什么?的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。