iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 2
1
Modern Web

RE:從零開始的學習 JS 生活系列 第 2

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

前言

轉生第一日,來到 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:

document.getElementById('box');

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

document.querySelector('.box');

jQuery 的選取 HTML 作法:

$('.box');

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

結尾

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

本文同步於:https://hsiangfeng.github.io/javascript/20190916/2364388999/


上一篇
EP.0 RE:從零開始的學習 JS 生活-轉生之目錄
下一篇
EP.2 RE:從零開始的學習 JS 生活-第二日
系列文
RE:從零開始的學習 JS 生活32
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

1
Kuro Hsu
iT邦新手 1 級 ‧ 2019-09-17 00:01:57

其實 JavaScript 當初有些語法是從 Java 借來的,只是後來 Java 自己也廢棄不用 XD
(望向那個 Date 物件

Ray iT邦研究生 4 級 ‧ 2019-09-17 00:10:55 檢舉

野生的 Kuro 出現惹~~~
這個知識我真的是不知道(筆記),滿多語言真的都是東借借西借借的概念XD

我要留言

立即登入留言