更新於 2022/11/10閱讀時間約 6 分鐘

【JavaScript 簡史】什麼是 ES5、ES6?網頁開發與 ECMAScript 的小故事

在一開始學習前端開發的時候,一直遇到講師在課程內容中提到 ES5、ES6 等關鍵字,當初的我,單純認為 ES5、ES6 是講述 JavaScript 的版本,所以在使用上就沒有想太多,反正就是 JavaScript 1.0 、2.0 的感覺吧?
殊不知等到想更精進自己技術時,才發現自己對於 JavaScript 這門程式語言的特性很不了解,導致在使用時總會有不順手的地方,此時,我才意會到「了解某項技術會問世」的原因非常重要
比起聽到某一個技術很潮、很酷,而想要跟風使用,不如多花時間了解某項技術是為了解決什麼問題才出現,才能在對的時間用最快速、最有效率的辦法解決問題。
如果你目前也正在嘗試讓自己的 JavaScript 進步,那多了解 JavaScript 的歷史,會是一個非常好的起手式,那麼就讓我們開始吧!


關於 Modern JavaScript

在開始了解 JavaScript 與網頁瀏覽器的愛恨糾葛前,我們首先要先認知到一件事:現在的 JavaScript 一定跟最一開始發展起來的模樣有所落差,落差的程度不只一點點,甚至差距非常多!
我們現在常使用的 Chrome DevTools、框架,甚至常見的 library 都不是只有一個公司、一個團隊所完成的。
就像先前所說到,在軟體開發的領域中,往往不是新技術出現後,才有人去使用,或者是在某一段時間突然出現新框架、新技術,開發者們就馬上拿來用,更多時候是由遇到某個問題的開發者,為了解決當前的困擾,而創造出新的技術,再根據這個技術延伸出技術社群。
同理,當社群中有人遇到了新的問題,此時又會有相對應的新技術產生。
JavaScript 也是在這樣的狀況下誕生的,那 JavaScript 究竟是要解決什麼問題呢?這件事要從網路技術的誕生開始說起。


JavaScript 的前世今生

在 1960 年代,網路作為美軍的通訊技術誕生,一直到 1990 年代中旬,才在美國被廣泛使用在商業上,而我們現今常用的網路瀏覽器,正式在當時的時空背景下誕生的。
在 1993 年時,美國 NCSA (國家超級電腦應用中心)發表了 Mosaic ,作為最早普遍流行的圖形化瀏覽器,Mosaic 支援多種網路協定。
由於 Mosaic 的興起,在 1994 年時 Mosaic 的主要開發人員自立門戶,創立了 Netscape 公司,並後續開發了 NetScape Navigator 瀏覽器,也就是現今眾多瀏覽器的前身。
於是在這樣瀏覽器蓬勃發展的時空背景下,為了可以讓網頁有更多種呈現方式,譬如插入圖片等需求,HTML 作為標記語言在 1993 年誕生了。
然而在最初,開發人員都需要仰賴 SSR (伺服器端渲染)的方式進行網頁資訊的渲染及驗證,簡單來說就是,當使用者在網頁上修改了什麼資訊,需要直接傳送到伺服器端進行檢查。
萬一有錯字、格式錯誤怎麼辦呢?那就在從伺服器端把資料丟回給使用者囉!
這樣一來一回的傳遞方式,不僅讓伺服器負擔大,更遠遠降低使用者使用網頁的效率。
於是為了讓網頁可以在資料傳送到伺服器端前進行簡單的驗證,NetScape 更是在 1995 年時,由公司的一名職員 Brendan Eich ,在短短十天內開發出一款能在網頁上執行的語言,沒錯!這個語言就是 JavaScript 啦(當時並不是叫 JavaScript )!
現在你知道 JavaScript 是要解決什麼問題了吧?


標準化 JavaScript

但僅僅了解 JavaScript 的前世今生,其實還不足以解釋 ES5、ES6 到底什麼東西,為什麼對初學者來說這麼重要?讓我們繼續說完剛剛沒有說完的故事!
相信各位現在多多少少都聽過鼎鼎大名的 IE (Internet Explorer),但是卻沒有聽過所謂的 NetScape Navigator 吧?其實我也是在進入網頁開發領域後,才發現其實網頁瀏覽器百百種,不是只有 Google Chrome、Edge、Safari 及 IE 等。
1995 年時,不僅僅是 NetScape,微軟也加入了瀏覽器實作的戰場,微軟針對 NetScape Navigator 進行逆向工程,並根據 JavaScript 實作了一套 JScript,甚至自己額外加了一些功能,導致有些網頁在不同的瀏覽器上會有不同顯示效果,甚至根本無法顯示。
於是 JavaScript 徹底失去了標準化的規範,假設每個廠商都為了爭取市場佔有率,而開發出各式各樣獨特的語法、功能,那最後倒霉的不就是使用者自己嗎?
這樣的行為並沒有解決當前使用者使用網頁效率的問題,反而產生了更多問題。
於是在 1996 年時,NetScape 向 ECMA(歐洲計算機製造商協會)提出標準化語言標準,並於隔年實現 ECMA-262 標準,再之後,就是我們所知道的每個 ECMA 標準了:
From Wikipedia
From Wikipedia
在上圖中,ECMA 會提出一些對於 JavaScript 實作的規範,而這些規範可能會被瀏覽器實作(也就是有被這個這個瀏覽器支援),也有可能不會。
所謂的 ES5 以前,就是泛指 2011 年前所被實作的 JavaScript, 而 ES6 則是指 ECMAScript 2015,在這個版本中,一次性的規範:let、const、arrow function、Promise、Symbol、class 等概念,讓開發上更加嚴謹,而詳細的實作細節可以參考 W3C 文件。
當然後續的 ES7、ES8 的相關規範,大家也都可以在網路上找到相關的知識。
現在大家知道為什麼在職缺上,會有「需要 ES6+ JavaScript 技能」的相關技能描述了吧!
這裡眼尖的朋友們可能會想,即便 JavaScript 被標準化了,不同的版本依然有可能同時存在,那瀏覽器之間是否有向下、向上相容的狀況呢?那又是另外一個議題了。
相信透過這篇文章,大家可以更加了解何謂 ECMAScript 及 JavaScript 版本間的差異,關於網頁開發你有沒有什麼問題想要跟我分享的呢?歡迎你在下方留言與我分享。
希望今天的文章有幫助到正在閱讀的你,如果你喜歡我的文章的話,可以留下你的愛心或是收藏我的文章,也或者可以點選「贊助」,你的一杯咖啡絕對是我持續寫下去的動力!或是透過拍拍手,用你小小的行動支持我的創作!
我是Vivian,我們下次見。
關於我:
一名從英文系畢業的前端工程師,喜歡閱讀、寫東西及自我成長。
|聯絡我:vivian.enlife@gmail.com
分享至
成為作者繼續創作的動力吧!
© 2024 vocus All rights reserved.