想了解學(xué)javascript的好處嗎？想了解TypeScript 的好處都有啥？和 JavaScript 的區(qū)別在哪？，一起來聊一下 JavaScript 的用途和那些特性，為什么前端要學(xué)JavaScript？JS都有哪些逆天的功能？，學(xué)了JavaScript能做什么？?? 嗎？......本文帶你一探究竟。

1.TypeScript 的好處都有啥？和 JavaScript 的區(qū)別在哪？

這是一個之前面試被問到的問題。不過以前并沒有思考過這個問題，面試時又太緊張，并沒有答好。在我看來 相對于 ，除了靜態(tài)類型外沒帶來任何東西。既然如此靜態(tài)類型有什么好處？靜態(tài)類型的好處到處都有說，這里就不說得太詳細(xì)了，隨便列一點(diǎn)。杜絕手誤導(dǎo)致的變量名寫錯。自動完成。重構(gòu)支持。類型可以一定程度上充當(dāng)文檔對我來說最有用的就是這幾點(diǎn)，特別是自動完成。本人天生腦容量小，難以駕馭動態(tài)類型語言。靜態(tài)類型解放腦容量，自動完成讓我不需要記憶哪個變量里有哪些屬性，也不需要記完整的變量名。函數(shù)上的類型約束外加盡量主動寫純函數(shù)讓我在寫函數(shù)實(shí)現(xiàn)的時候不需要關(guān)注函數(shù)之外的任何東西，注意力聚焦在當(dāng)前函數(shù)。當(dāng)然，也不只有好處。靜態(tài)類型有哪些不足？類型標(biāo)注麻煩?，F(xiàn)階段大部分靜態(tài)類型語言的類型系統(tǒng)還不夠強(qiáng)。eval 和 new Function() 這種騷操作類型系統(tǒng)管不到。需要編譯，類型檢查會增加編譯時長，語法和類型系統(tǒng)復(fù)雜的話時間特別特別長，比如 scala。標(biāo)注麻煩的問題無法根絕，但是類型推導(dǎo)能解決大部分的類型標(biāo)注問題。類型系統(tǒng)不夠強(qiáng)的問題會隨著時間慢慢變好。編譯的問題在 ts 可能也并不算問題，ts 的類型檢查并不影響 ts 編譯成 js。也就是說就算類型檢查不通過 ts 也能跑起來。所以對 ts 來說類型檢查可以從編譯中提取出來，作為獨(dú)立的編譯和類型檢查兩部分。先編譯輸出，再做類型檢查，編譯的部分相當(dāng)于 babel 這種工具做的事。類型檢查也可以單獨(dú)運(yùn)行。那么， 的類型系統(tǒng)有哪些特點(diǎn)？圖靈完備。（雖然不太清楚這意味著什么）漸進(jìn)的類型系統(tǒng)，所有類型標(biāo)注都是可選的，既是天使又是惡魔的 any 類型。（被 Haskell 大牛 Colliot 稱為 ts 類型系統(tǒng)的漏洞）支持局部類型推導(dǎo)。豐富的類型層面的計算，如 index types, mapped types, types 等等。支持鴨子類型。（或叫結(jié)構(gòu)子類型？）像 js 支持對象字面量一樣支持方便的對象字面類型（object literal type），字符串和數(shù)字還有布爾值字面類型?？瞻踩??；诳刂屏鞯念愋头治?。還有許多我覺得比較平常的點(diǎn)就沒有列出來，比如支持類型別名，泛型，協(xié)變逆變雙變等等。ts 是一門非常非常非常工程的語言，很強(qiáng)大，但是可能和優(yōu)雅沾不上半點(diǎn)關(guān)系?？蛇x的類型標(biāo)注搭配類型推導(dǎo)，讓 ts 的類型系統(tǒng)更像是工具，而不是枷鎖。好的產(chǎn)品是用完即走的。有時候，稍微開個洞，能讓事情變簡單很多。比如 any。鴨子類型加上上面提到的特性可以讓你依舊感覺和 js 一樣，像大海里的魚一樣自由。Null : The Billion Dollar Mistake ，而 js 里有兩個 null（null 和 undefined），雖然前端通常不會造成非常嚴(yán)重的損失，但是 js 也慢慢被應(yīng)用到不僅僅是前端的許多地方了。ts 這么好，怎么學(xué) ？成也漸進(jìn)，敗也漸進(jìn)，有部分人通過可選的類型標(biāo)注，一步一步無痛地過渡到學(xué)會 ts。而另一部分人玩了一會兒，發(fā)現(xiàn)和寫 js 并沒有一丁點(diǎn)區(qū)別，而且還離開了熟悉的環(huán)境，就放棄了。ts 并不會強(qiáng)迫你使用類型，所以就需要更強(qiáng)的動力來推動自己學(xué)習(xí)。如果身邊有會 ts 的朋友的話，對學(xué)習(xí) ts 會比較有幫助。多讓會 ts 的朋友看自己的代碼，改良自己的寫法。多寫，很容易就能學(xué)會。如果身邊沒有會 ts 的人，其實(shí)我更建議先用 JSDoc。使用 vscode 或者 webstorm 的時候直接寫 JSDoc 就行了，vsc 或 webstorm 會依靠 ts 來提供類型推導(dǎo)和自動完成。這樣可以在工作或自己寫東西的時候慢慢習(xí)慣并且主動去使用類型標(biāo)注。在使用一段時間后感覺 JSDoc 已經(jīng)不夠用了，滿足不了自己的需求了，再開始使用 ts。同時也要多主動去了解和學(xué)習(xí)一些 ts 的代碼，不然的話，不知道 ts 有多好，自然就不會覺得 JSDoc 不夠用。

2.一起來聊一下 JavaScript 的用途和那些特性

簡介我們一起來聊一下 ，用它能做什么，它有哪些特性，以及一些跟它配合使用的技術(shù)。什么是 ？ 最初的目的是為了“賦予網(wǎng)頁生命”。這種編程語言我們稱之為腳本。它們可以寫在 HTML 中，在頁面加載的時候會自動執(zhí)行。腳本作為純文本存在和執(zhí)行。它們不需要特殊的準(zhǔn)備或編譯即可運(yùn)行。這方面， 和 Java 有很大的區(qū)別。為什么叫 ？ 在剛誕生的時候，它的名字叫 “”。但是因?yàn)楫?dāng)時 Java 很流行，所以決定將一種新語言定位為 Java 的“弟弟”會有助于它的流行。隨著 的發(fā)展，它已經(jīng)變成了一門獨(dú)立的語言，同時也有了自己的語言規(guī)范 ?，F(xiàn)在，它和 Java 之間沒有任何關(guān)系?，F(xiàn)在， 不僅僅是在瀏覽器內(nèi)執(zhí)行，也可以在服務(wù)端執(zhí)行，甚至還能在任意搭載了 引擎 的設(shè)備中都可以執(zhí)行。瀏覽器中嵌入了 引擎，有時也稱作 虛擬機(jī)。不同的引擎有不同的“代號”，例如：V8 —— Chrome 和 Opera 中的 引擎。 —— Firefox 中的 引擎?！€有其他一些代號，像“Trident”，“Chakra”用于不同版本的 IE，“”用于 Microsoft Edge，“Nitro”和“”用于 Safari，等等。上面這些名稱很容易記憶，因?yàn)榻?jīng)常出現(xiàn)在網(wǎng)上開發(fā)者的文章中。我們也會用到這些名稱。例如：某個新的功能，如果“ 引擎 V8 是支持的”，那么我們可以認(rèn)為這個功能大概能在 Chrome 和 Opera 中正常運(yùn)行。引擎是如何工作的？引擎很復(fù)雜，但是基本原理很簡單。引擎（通常嵌入在瀏覽器中）讀取（“解析”）腳本。然后將腳本轉(zhuǎn)化（“編譯”）為機(jī)器語言。然后這機(jī)器語言代碼快速地運(yùn)行。引擎會對流程中的每個階段都進(jìn)行優(yōu)化。它甚至可以在運(yùn)行時監(jiān)視編譯的腳本，分析數(shù)據(jù)流并根據(jù)這些對機(jī)器代碼應(yīng)用優(yōu)化。最后，腳本會執(zhí)行地非?？?。瀏覽器中的 能做什么？現(xiàn)代的 是一種“安全”語言。它不提供對內(nèi)存或 CPU 的底層訪問，因?yàn)樗畛跏菫闉g覽器創(chuàng)建的，不需要這些功能。 的能力很大程度上依賴于它執(zhí)行的環(huán)境。例如：Node.js 允許 讀寫任意文件、執(zhí)行網(wǎng)絡(luò)請求等。瀏覽器中的 可以做與網(wǎng)頁操作、用戶交互和 Web 服務(wù)器相關(guān)的所有事情。例如，瀏覽器中的 可以完成下面這些事：在網(wǎng)頁中插入新的 HTML，修改現(xiàn)有的網(wǎng)頁內(nèi)容和網(wǎng)頁的樣式。響應(yīng)用戶的行為，響應(yīng)鼠標(biāo)的點(diǎn)擊或移動、鍵盤的敲擊。向遠(yuǎn)程服務(wù)器發(fā)送網(wǎng)絡(luò)請求，下載或上傳文件（所謂 AJAX 和 COMET 技術(shù)）。獲取或修改 cookie，向訪問者提出問題、發(fā)送消息。記住客戶端的數(shù)據(jù)（本地存儲）。瀏覽器中的 不能做什么？為了用戶的（信息）安全，在瀏覽器中的 的能力是有限的。這樣主要是為了阻止邪惡的網(wǎng)站獲得或修改用戶的私人數(shù)據(jù)。這些限制的例子有：網(wǎng)頁中的 不能讀、寫、復(fù)制及執(zhí)行用戶磁盤上的文件或程序。它沒有直接訪問操作系統(tǒng)的功能?，F(xiàn)代瀏覽器允許 做一些文件相關(guān)的操作，但是這個操作是受到限制的。僅當(dāng)用戶使用某個特定的動作， 才能操作這個文件。例如，把文件“拖”到瀏覽器中，或者通過 <input> 標(biāo)簽選擇文件。 有很多方式和照相機(jī)/麥克風(fēng)或者其他設(shè)備進(jìn)行交互，但是這些都需要提前獲得用戶的授權(quán)許可。所以，啟用了 的網(wǎng)頁應(yīng)該不會偷偷地啟動網(wǎng)絡(luò)攝像頭觀察你，并把你的信息發(fā)送到美國安全局。不同的瀏覽器標(biāo)簽頁之間基本彼此不相關(guān)。有時候，也會有一些關(guān)系。例如，一個標(biāo)簽頁通過 打開另外一個新的標(biāo)簽頁。但即使在這種情況下，如果兩個標(biāo)簽頁打開的不是同一個網(wǎng)站（域名、協(xié)議或者端口任一不相同的網(wǎng)站），他們都不能夠相互通信。這就是“同源策略”。為了解決“同源策略”問題，兩個標(biāo)簽頁必須都包含一些處理這個問題的特殊的 代碼，并均允許數(shù)據(jù)交換，這樣才能夠?qū)崿F(xiàn)兩個同源標(biāo)簽頁的數(shù)據(jù)交換。本教程會講到這部分相關(guān)的知識。這個限制也是為了用戶的信息安全。例如，用戶打開的 網(wǎng)頁的 肯定不能訪問 通過互聯(lián)網(wǎng)可以輕松地和當(dāng)前網(wǎng)頁域名的服務(wù)器進(jìn)行通訊。但是從其他網(wǎng)站/域名的服務(wù)器中獲取數(shù)據(jù)的能力是受限的。盡管這可以實(shí)現(xiàn)，但是需要來自遠(yuǎn)程服務(wù)器的明確協(xié)議（在 HTTP 頭中）。這也是為了用戶的數(shù)據(jù)安全。瀏覽器環(huán)境外的 一般沒有這些限制。例如服務(wù)端的 就沒有這些限制。現(xiàn)代瀏覽器還允許安裝可能會要求擴(kuò)展權(quán)限的插件或擴(kuò)展。是什么使得 與眾不同？至少有 3 件事值得一提：+ 和 HTML/CSS 完全的集成。 + 使用簡單的工具完成簡單的任務(wù)。 + 被所有的主流瀏覽器支持，并且默認(rèn)開啟。滿足這三條的瀏覽器技術(shù)也只有 了。這就是為什么 與眾不同！這也是為什么它是創(chuàng)建瀏覽器界面的最普遍的工具。此外， 還支持創(chuàng)建服務(wù)器，移動端應(yīng)用程序等。比 “更好”的語言不同的人喜歡不同的功能， 的語法也不能夠滿足所有人的需求。這是正常的，因?yàn)槊總€人的項目和需求都不一樣。所以，最近出現(xiàn)了很多不同的語言，這些語言在瀏覽器中執(zhí)行之前，都會被編譯（轉(zhuǎn)化）成 ?，F(xiàn)代化的工具使得編譯速度非?？焖偾彝该鳎瑢?shí)際上允許開發(fā)人員使用另一種語言編寫代碼并將其自動轉(zhuǎn)換為 。這些編程語言的例子有： 是 的語法糖，它語法簡短，明確簡潔。通常使用 Ruby 的人喜歡用。 將注意力集中在增加嚴(yán)格的數(shù)據(jù)類型。這樣就能簡化開發(fā)，也能用于開發(fā)復(fù)雜的系統(tǒng)。 是微軟開發(fā)的。Flow 也添加了數(shù)據(jù)類型，但是以一種不同的方式。由 Facebook 開發(fā)。Dart 是一門獨(dú)立的語言。它擁有自己的引擎用于在非瀏覽器環(huán)境中運(yùn)行（如：手機(jī)應(yīng)用），它也能被編譯成 。由 Google 開發(fā)。還有很多其他的語言。當(dāng)然，即使我們在使用這些語言，我們也需要知道 。因?yàn)閷W(xué)習(xí) 可以讓我們真正明白我們自己在做什么?？偨Y(jié) 最開始是為瀏覽器設(shè)計的一門語言，但是現(xiàn)在也被用于很多其他的環(huán)境。現(xiàn)在， 是一門在瀏覽器中使用最廣、并且能夠很好集成 HTML/CSS 的語言。有很多其他的語言可以被編譯成 ，這些語言還提供了更多的功能。最好還是了解一下這些語言，至少在掌握了 之后簡單地看一下?，F(xiàn)代 教程：開源的現(xiàn)代 入門到進(jìn)階的優(yōu)質(zhì)教程。在線免費(fèi)閱讀：

3.為什么前端要學(xué)JavaScript？JS都有哪些逆天的功能？

相信每一個想要學(xué)習(xí)前端的人對于前端三劍客html+css+js都不會陌生，這些可以說是一個前端的標(biāo)配，而在前端的世界里，沒有什么是實(shí)現(xiàn)不了的，你真的了解js嗎？關(guān)于JS有一句話：凡是可以用 來寫的應(yīng)用，最終都會用 .吹了這么久JS，究竟它的魔力在哪里？能運(yùn)用在哪些方面呢？為什么前端要學(xué)？可運(yùn)行在所有主要平臺的所有主流瀏覽器上，也可運(yùn)行在每一個主流操作系統(tǒng)的服務(wù)器端上。現(xiàn)如今我們在為網(wǎng)站寫任何一個主要功能的時候都需要有懂能夠用寫前端的開發(fā)人員。而后端代碼是用什么編寫的則無所謂——不管是Java，PHP，.NET，Node.js還是其他——但是客戶端就一定需要一個開發(fā)人員。事實(shí)上，現(xiàn)在很多開發(fā)人員依然沒有認(rèn)識到有多么強(qiáng)大。不知道正在閱讀的你是否也是這些井底之蛙的一員。如果你確實(shí)是一個了不起的程序員，那么基本上所有有關(guān)于服務(wù)器端平臺的工作都能夠勝任。如果再了解這些平臺基本上就可以上任了。JS實(shí)際使用的功能和領(lǐng)域，下面我們就來了解一下。1.數(shù)據(jù)可視化數(shù)據(jù)可視化是當(dāng)下大家所推崇的一種互動展示模式，而擁有ECharts、Dygraphs.js、D3.js、InfoVis、Springy.js等多種可實(shí)現(xiàn)數(shù)據(jù)可視化效果的框架。2.移動應(yīng)用PhoneGap將WebView帶向了移動應(yīng)用，同時也將帶向了移動應(yīng)用。3.服務(wù)端因?yàn)閂8的性能將帶到了一個新的高度，于是Node.js誕生了——前端、后臺都可以用，現(xiàn)在任何一個網(wǎng)頁都離不開。4.全平臺應(yīng)用一份代碼構(gòu)建移動、桌面、Web能夠全平臺應(yīng)用，在Eletcron上運(yùn)行Ionic，就意味著無限的可能性。5.游戲如果你對網(wǎng)頁游戲僅僅停留在Flash的時代，認(rèn)為只有Flash才能做出非常絢麗的游戲特效，那就錯了。也可以做出華麗的特效！6.VR利用3D 游戲引擎，如Three.js，你也可以來創(chuàng)建一個 3D 世界。7.硬件Tessel可以直接在設(shè)備上運(yùn)行，連服務(wù)器都不需要，然后像做網(wǎng)絡(luò)開發(fā)一樣通過用IDE和庫去開發(fā)它，上傳新的固件只需一句tessel 推送指令。8.操作系統(tǒng)那么是否有可能僅使用 Node.js 創(chuàng)建一個操作系統(tǒng)呢？NodeOS了解一下，雖然它是用 Linux 內(nèi)核來處理各種底層任務(wù)，比如硬件通訊什么的，但是除此之外，使用的都是 Node.js。

4.學(xué)了JavaScript能做什么？

相信每一個想要學(xué)習(xí)前端的人對于前端三劍客html+css+js都不會陌生，這些可以說是一個前端的標(biāo)配，而在前端的世界里，沒有什么是實(shí)現(xiàn)不了的，你真的了解js嗎？關(guān)于JS有一句話：凡是可以用 來寫的應(yīng)用，最終都會用 .吹了這么久JS，究竟它的魔力在哪里？能運(yùn)用在哪些方面呢？1.數(shù)據(jù)可視化數(shù)據(jù)可視化是當(dāng)下大家所推崇的一種互動展示模式，而擁有ECharts、Dygraphs.js、D3.js、InfoVis、Springy.js等多種可實(shí)現(xiàn)數(shù)據(jù)可視化效果的框架。2.移動應(yīng)用PhoneGap將WebView帶向了移動應(yīng)用，同時也將帶向了移動應(yīng)用。3.服務(wù)端因?yàn)閂8的性能將帶到了一個新的高度，于是Node.js誕生了——前端、后臺都可以用，現(xiàn)在任何一個網(wǎng)頁都離不開。4.全平臺應(yīng)用一份代碼構(gòu)建移動、桌面、Web能夠全平臺應(yīng)用，在Eletcron上運(yùn)行Ionic，就意味著無限的可能性。5.游戲如果你對網(wǎng)頁游戲僅僅停留在Flash的時代，認(rèn)為只有Flash才能做出非常絢麗的游戲特效，那就錯了。也可以做出華麗的特效！6.VR利用3D 游戲引擎，如Three.js，你也可以來創(chuàng)建一個 3D 世界。7.硬件Tessel可以直接在設(shè)備上運(yùn)行，連服務(wù)器都不需要，然后像做網(wǎng)絡(luò)開發(fā)一樣通過用IDE和庫去開發(fā)它，上傳新的固件只需一句tessel 推送指令。8.操作系統(tǒng)那么是否有可能僅使用 Node.js 創(chuàng)建一個操作系統(tǒng)呢？NodeOS了解一下，雖然它是用 Linux 內(nèi)核來處理各種底層任務(wù)，比如硬件通訊什么的，但是除此之外，使用的都是 Node.js。一個優(yōu)秀的前端怎么能夠不會JS？Js學(xué)習(xí)點(diǎn)擊加入：前端學(xué)習(xí)

上述文章了解到關(guān)于TypeScript 的好處都有啥？和 JavaScript 的區(qū)別在哪？，一起來聊一下 JavaScript 的用途和那些特性，為什么前端要學(xué)JavaScript？JS都有哪些逆天的功能？，學(xué)了JavaScript能做什么？?? ，讓我們對學(xué)javascript的好處 有一個直觀的認(rèn)知。我們發(fā)現(xiàn)，作為一個優(yōu)秀的Java程序員是多么的自豪。