EP.1 RE:從零開始的學習 JS 生活-第一日之 JavaScript 介紹

前言

轉生第一日,來到 JS 世界的第一天就跟勇闖異世界一樣必須要先理解這個世界的背景。

JavaScript 介紹

一開始在學習任何一個語言之前,通常都會建議要去了解一下這個語言背景,所以前面轉生第一天就會稍微介紹一下 JavaScript 的歷史背景。

首先 JavaScript 最常被誤解跟 Java 有關係,早期 JavaScript 是叫做 Mocha,後來當時也有一個程式語言很流行也就是 Java,那 Mocha 為了跟上熱潮,才會將名稱改成 JavaScript,前一個名稱我記得是 LiveScript,關於這部分我翻了一下 it 邦 kuro 大大剛好有介紹過更詳細的,所以這邊我就不再多做介紹。

重新認識 JavaScript: Day 02 JavaScript 簡介

所以基本上 JavaScript 到底與 Java 有沒有關係呢?其實是完全沒有,就只是為了跟上當初的熱潮而加上 Java 而已。

早期 JavaScript 用途

早期 JavaScript 的用途其實很簡單,單純只是為了操作 HTML 而已,所以在早期 JavaScript 並不是那麼被重視,大多人在開發網頁的時候都是以後端程式語言為主,如 PHP、C# 等等。

而且 JavaScript 在早期並沒有一定的規範,是直到後來出現一個叫做 ECMAScript 的國際組織來定義 JavaScript,否則早期撰寫 JavaScript 是真的滿隨便寫的(咦?!),而且 ECMAScript 的組織也不停地替 JavaScript 增加功能,例如後面會講得嚴格模式、常數以及其他更多語法。

ECMAScript

但是 ECMAScript 雖然替我們優化了許多 JavaScript 缺乏的地方,進而更強化 JavaScript,但是僅有標準卻沒有實現的地方,那終究也只是一套標準而已,所以就必須要有實現的人,而瀏覽器就是替我們實現 ECMAScript 的人,可是這邊又會發生一件事情,每一間瀏覽器的支援性又不同,所以說 ECMAScript 的每一套制定標準並不是都通用的。

這邊舉例 const 來講,IE 系列就有不支援該語法的問題 ↓

IE 不支援

所以如果客戶群中有使用舊版 IE 的習慣,那麼就會變成 const 不能運作的問題,通常開發時就會使用一些 JavaScript 編譯器、轉譯器,將不支援的語法變成可支援的語法,例如 Babel。

jQuery 進化史

那麼 jQuery 又是什麼呢?簡單一點來講 jQuery 簡化了許多我們語法上的操作,例如操作 DOM 元素、事件處理等等,而且 jQuery 也替我們解決了支援性的問題,這樣講其實很模糊,這邊讓我舉個例子,讓我們來看看原生語法在選取 HTML 元素時與 jQuery 語法有何差異。

原生語法選取 HTML:

1
document.getElementById('box');

另一種類似 jQuery 的原生語法選取 HTML 作法:

1
document.querySelector('.box');

jQuery 的選取 HTML 作法:

1
$('.box');

你沒看錯 jQuery 就是這麼簡單,我想看到這邊你也會比較清楚為什麼 jQuery 會這麼紅的原因了。

結尾

下一篇的 RE:從零開始的學習 JS 生活-第二日 將會介紹變數。