# 跌破眾人眼鏡! 聊聊 JavaScript 的封王之路 歡迎來到 Ian 的知識講堂，本篇會用說故事的方式跟大家聊聊全端寵兒 - JavaScript 的小故事。 ## 關於我 - [AwesomeCS](https://www.facebook.com/AwesomeCS-100681602024246/) 站長 - Deno Taiwan 版主 - [ref](https://www.google.com/search?q=Deno+%E5%85%A5%E9%96%80%E6%8C%87%E5%8D%97&oq=Deno+%E5%85%A5%E9%96%80%E6%8C%87%E5%8D%97&aqs=chrome..69i57.8933j0j7&sourceid=chrome&ie=UTF-8) - SITCON 講者 - 熱愛計算機科學，略懂網頁全端開發、網頁安全、區塊鏈，目前嘗試將觸角延伸到嵌入式系統上，希望在進入職場前具備垂直整合的能力。 ## 學習程式語言之前... - 搞懂用途 >  ## 爹不疼娘不愛!這樣的孩子注定會失敗嗎? JavaScript 之父 – Brendan Eich 曾表示過自己並不喜歡這門程式語言，那 JavaScript 是如何在近年來一躍成為最受歡迎的程式語言之一呢? >  > **布蘭登·艾克** > 布蘭登·艾克，美國程式技術專家與企業家， JavaScript 主要創造者與架構師，曾任 Mozilla 公司的技術長，並曾短暫擔任執行長。 > [wikipedia](https://zh.wikipedia.org/zh-tw/%E5%B8%83%E8%98%AD%E7%99%BB%C2%B7%E8%89%BE%E5%85%8B) 最初， JavaScript 作為一個腳本語言，被設計來增加網頁與使用者的互動能力。開發團隊僅花了 10 天就完成 JS 的原型設計。 ### JAVA 與 JavaScript 的關聯性? 筆者仍記得: 我在 2020 年底參加交通大學碩士班的推薦甄試時，有與面試官聊到我的主要技能，內容大概是: ``` 考官: 你最擅長什麼語言阿? 我: JavaScript 。 考官: 喔， JAVA 阿。 我: 不，是 JavaScript ! 考官: Java...Script...? 我: 對， JavaScript 。 ``` > 筆者十分肯定自己在當時有用正確的發音將 JavaScript 這個名詞給說出來。 上述的情境真的叫人好氣又好笑，不過 JavaScript 之所以會叫做 JavaScript ，其原因也是十分的**隨性**。 - 在 1995 年 5 月時，這個用來添加網頁互動性的腳本語言被稱為 **Mocha** 。 - 同年 9 月， Mocha 又被正名為 **LiveScript** 。 - 你以為這樣就結束了嗎? 錯!還是熟悉的 1995 年 ( 12 月)，[網景公司](https://zh.wikipedia.org/zh-tw/%E7%B6%B2%E6%99%AF)與[昇陽電腦公司](https://zh.wikipedia.org/wiki/%E6%98%87%E9%99%BD%E9%9B%BB%E8%85%A6)組成的開發團隊為了讓 LiveScript 搭上 JAVA 的潮流，將 LiveScript 正名為 **JavaScript** 。 > 我想，正是因為開發團隊的**隨性**，才會讓現代的 JS Developer 叫苦連天。 >  > 上圖為 JavaScript 的神奇三角。 > 參考： [等於、全等](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Equality_comparisons_and_sameness)。 ### JS 的標準化: ECMAScript 。 > 規則與定義方便開發者實作，標準化讓開發者無須煩惱平台遷移的重工發生。 > -- 誰說的? Ian 說的。 1995 年， IE 瀏覽器誕生了，調皮的微軟直接將網景公司的 JS 直譯器進行逆向工程並基於 JavaScript 創造了 JScript 腳本語言。 這樣的舉動，會造成一樣的腳本程式在不同的瀏覽器上會有不同的運行結果。在當時，網頁開發者通常會把「用 Netscape 可達到最佳效果」或「用 IE 可達到最佳效果」的標誌放在首頁上。 > 對於商業化的工程工具，標準化是一定要走的路，像是: 我們目前在電腦上使用的浮點數運算也遵守了 IEEE 754 的規範。 隔年年底，網景公司向 ECMA 提交了語言標準， 1997 年 6 月， ECMA 以 JavaScript 為基礎制定了 ECMAScript 標準規範 [**ECMA-262**](https://www.ecma-international.org/publications-and-standards/standards/ecma-262/) 。 有了標準規範後，即使在當時的市面上有 JavaScript 、 JScript 、 ActionScript ，開發者也不用因為平台遷移而感到煩惱(儘管直譯器的設計與實作不盡相同)。 > 實際上，現今各家瀏覽器對 JavaScript 的實作仍不盡相同，開發者在開發時仍需考慮新標準的普及率，任何語法我們都可以在 [Can i use](https://caniuse.com/?cats=JS&statuses=all) 這個網站上得到答案。 ### JavaScript 的冰河時期 雖然 JavaScript 的冰凍期不像機器學習一樣長達 50 年的時間，但 JS 的新標準推動停滯也造成了一些影響，請參考以下資料: - ECMA-262的第一個版本於 1997 年 6 月被 ECMA 組織採納 - ECMAScript 3 (ES3) 發行於 1999 年 - ECMAScript 4 (ES4) 遭棄用(原因是貿然大幅度更新對用戶不太好所以改成每年逐一釋出) - ECMAScript 5 (ES5) 發行於 2009 年 - ECMAScript 6 (ES6) 發行於 2015 年 - ..隨後每年穩定發行 從上面的資料不難發現，從 ES3 到 ES5 發行，間隔竟然長達 10 年之久! > 由於在語言的複雜性意見上出現分歧，所以 ES4 是被棄用的，這也是 JQuery 取得成功的原因之一。 ## 回到正題， JavaScript 到底是如何成王的? 時至今日， JavaScript 已成為許多人的入門語言首選，在金門大學資工系上，更是有教授以 JavaScript 作為教學的主力工具。 至於為何筆者會說 JavaScript 成王了呢? 我想，數字會說話:  > 上圖來源: [ALPHAcamp](https://tw.alphacamp.co/blog/2020-in-demand-programming-language-job-opportunity) 。 JavaScript 能夠有如此的成長速度，筆者認為主要原因有四: - ECMA 標準化的持續推動 - 能夠為網頁添增互動性 - 近年智慧型手機的普及以及性能提升 - Node.js ECMA 標準持續推動，讓 JavaScript 的語法越來越完整及多元，再加上這 10 年來智慧型手機的效能有非常可怕的成長速度。 > 筆者仍記得，在 10 年前左右的手機若有 1GHz 的時脈便非常嚇人，之後的 5 年間更是朝著高時脈、多核心的方向發展，在 2012 年推出的 [Nexus 7](https://www.techbang.com/posts/12245-flat-up-creating-exclusive-own-hand-7-inch) ，其效能就足夠運行 Ubuntu 作業系統了。 更別提現在十分流行的一頁式網頁設計都是在 Node.js 的幫助下完成的。 > 上面的用詞可能不太精確， SPA 主要是利用前端框架 + Webpack 工具實現，而這些工具都是符合 Node.js 標準的第三方套件。 ### 除了網頁開發， JS 有何用處? 用處可多了，時下最流行的區塊鏈、機器學習等技術， JS 開發者都可以在吸收其基礎知識後參一腳，像是: - [區塊鏈] [Hyperledger Fabric](https://www.hyperledger.org/use/fabric) Hyperledger Fabric 最初由 IBM 主導開發，之後便貢獻給 Linux 基金會， Fabric 可以讓企業搭建聯盟鏈並在上面放入商業邏輯，其中智能合約、後端的串接都有完整的 Node.js SDK 可以使用。 - [機器學習] [BrianJS](https://brain.js.org/#/) - [機器學習] [TensorFlow.js](https://www.tensorflow.org/js?hl=zh-tw) - [資料圖表化] [D3.js](https://d3js.org/) ## 總結 我在去年的學生計算機年會就有簡單的提到 JS 的小故事，不過當時真的太緊張，有很多東西都漏講了，實在是有些可惜(?) 因此，我也趁這次機會重新研讀 JavaScript 的歷史並分享給大家~! > 如果想學 JavaScript ，可以參考該[問答串](https://ithelp.ithome.com.tw/questions/10202062)。 ## Reference - 維基百科 - [[SITCON 2020] 現代網頁趨勢＆演算法對其的影響](https://sitcon.org/2020/agenda/cca72fad-3577-46d0-a7af-966bc72e0fc1)