《JavaScript 闖關記》之簡介

時間 2019-11-16

原文原文鏈接

JavaScript 是面向 Web 的編程語言，絕大多數現代網站都使用了 JavaScript，而且全部的現代 Web 瀏覽器（電腦，手機，平板）均包含了 JavaScript 解釋器。這使得 JavaScript 可以稱得上史上使用最普遍的編程語言。 JavaScript 也是前端開發工程師必須掌握的三種技能之一：描述網頁內容的 HTML、描述網頁樣式的 CSS、以及描述網頁行爲的 JavaScript。javascript

JavaScript 是一門 動態的、弱類型的、面向對象的、解釋型的 編程語言，很是適合面向對象和函數式的編程風格。JavaScript 的語法來自於 Java，它的一等函數（first-class function）來自於 Scheme，它的基於原型（prototype-based）的繼承來自於 Self。但學習本課程沒必要去了解那些（Java/Scheme/Slef）語言或熟悉那些術語。html

JavaScript 起源

時間：1995年前端

人物：Brendan Eich（布蘭登·艾奇）java

背景：那個時候，絕大多數因特網用戶都是用速度僅爲28.8kbit/s的「貓」上網，爲了完成簡單的表單驗證，必須把表單數據發送到服務器端才能肯定用戶是否沒有填寫某個必填域、是否輸入了無效的值，每次操做需等待30秒以上纔會有結果，這無疑是在慢性自殺。git

事件：當時走在技術革新最前沿的 Netscape 公司指派 Brendan Eich 開發一種客戶端語言，用來處理這種簡單的驗證，它就是 JavaScript。JavaScript 原名 LiveScript，Netscape 爲了搭上媒體熱炒 Java 的順風車，才把 LiveScript 更名爲 JavaScript。（因此 Java 和 JavaScript 的關係，就至關於雷鋒和雷峯塔的關係。）es6

自此之後，JavaScript 逐漸成爲市面上常見瀏覽器必備的一項特點功能。現在，JavaScript 的用途早已再也不侷限於簡單的數據驗證，而是具有了與瀏覽器窗口及其內容等幾乎全部方面交互的能力。今天的 JavaScript 已經成爲一門功能全面的編程語言，可以處理複雜的計算和交互，擁有了閉包、匿名（lambda，拉姆達）函數，甚至元編程等特性。github

JavaScript 從一個簡單的輸入驗證器發展成爲一門強大的編程語言，徹底出乎人們的意料。應該說，它既是一門很是簡單的語言，又是一門很是複雜的語言。說它簡單，是由於學會使用它只需片刻功夫；而說它複雜，是由於要真正掌握它則須要數年時間。編程

JavaScript 實現

隨着 JavaScript 的普及，微軟公司在 IE 瀏覽器中也加入了名爲 JScript 的 JavaScript 實現，因爲沒有標準規定 JavaScript 的語法和特性，致使市面上存在多個版本的 JavaScript 實現，且互不兼容，所以 JavaScript 標準化問題被提上了議事日程。瀏覽器

1997年，歐洲計算機制造商協會（ECMA，European Computer Manufactures Association）定義了名爲ECMAScript（發音爲 ek-ma-script）的腳本語言標準，它是通用的，與平臺無關的語言標準。自此之後，瀏覽器開發商開始致力於將 ECMAScript 做爲各自 JavaScript 實現的基礎。雖然基礎相同，但具體實如今不一樣瀏覽器上卻略有差別。服務器

JavaScript 和 ECMAScript 一般被人們用來表達相同的含義，但 JavaScript 的含義卻比 ECMAScript 中規定的要多得多。一個完整的 JavaScript 實現應該由下面三個不一樣的部分組成。

核心（ECMAScript）
文檔對象模型（DOM）
瀏覽器對象模型（BOM）

核心（ECMAScript）

ECMAScript 標準由 語法、數據類型、語句、關鍵字、保留字、運算符、對象 組成。它與 Web 瀏覽器沒有任何依賴關係，而且這門語言自己並不包含輸入和輸出定義。ECMAScript 定義的只是這門語言的基礎，而在此基礎之上能夠構建更完善的腳本語言。

Web 瀏覽器只是 ECMAScript 實現的宿主環境之一，其餘宿主環境包括 Node 和 Adobe Flash。宿主環境不只提供基本的 ECMAScript 實現，同時也會提供該語言的擴展（例如：DOM、BOM），這些擴展則利用 ECMAScript 的核心類型和語法提供更多更具體的功能。

JavaScript 是 Web 瀏覽器對 ECMAScript 標準的實現，ActionScript 是 Adobe Flash 對 ECMAScript 標準的實現。

ECMAScript 歷史

1997年，ECMAScript 1版發佈。

1998年6月，ECMAScript 2版發佈。

1999年12月，ECMAScript 3版發佈。

2000年，ECMAScript 4開始醞釀，最終這個版本沒有經過。

2009年12月，ECMAScript 5版發佈。

2011年6月，ECMAscript 5.1版發佈，成爲國際標準。

2015年6月，ECMAScript 6正式經過，成爲國際標準。

擴展閱讀「阮一峯的《ECMAScript 6 入門》」
es6.ruanyifeng.com/#docs/intro

3.0版是一個巨大的成功，在業界獲得普遍支持，成爲通行標準，奠基了 JavaScript 語言的基本語法，之後的版本徹底繼承。直到今天，初學者一開始學習 JavaScript，其實就是在學3.0版的語法。

文檔對象模型（DOM）

文檔對象模型（DOM，Document Object Model）是用於 HTML 的應用程序編程接口（API），它把整個頁面映射爲一個多層節點結構。HTML 頁面中的每一個組成部分都是某種類型的節點，這些節點又包含着不一樣類型的數據。看下面這個 HTML 頁面：

<html>
    <head>
        <title>Sample Page</title>
    </head>
    <body>
        <p>Hello World!</p>
    </body>
</html>複製代碼

經過 DOM 建立的這個表示文檔的樹形圖，開發人員得到了控制頁面內容和結構的主動權。藉助 DOM 提供的 API，開發人員能夠輕鬆自如地刪除、添加、替換或修改任何節點。

因爲 Netscape 和微軟實現的 DOM 互不兼容，負責制定 Web 通訊標準的 W3C（World Wide Web Consortium，萬維網聯盟）開始着手規劃 DOM。

DOM 1級：

DOM 核心：映射文檔結構，簡化對文檔中任意部分的操做和訪問。
DOM HTML：在 DOM 核心的基礎上，添加了針對 HTML 的對象和方法。

DOM 2級：

DOM 視圖：定義了跟蹤不一樣文檔視圖的接口。
DOM 事件：定義了事件和事件處理的接口。
DOM 樣式：定義了基於 CSS 爲元素應用樣式的接口。
DOM 遍歷和範圍：定義了遍歷和操做文檔樹的接口。

DOM 3級：

DOM 加載和保存：引入了以統一方式加載和保存文檔的方法。
DOM 驗證：新增了驗證文檔的方法。
DOM 核心擴展。

注意：

DOM 並非只針對 JavaScript 的，不少別的語言也都實現了 DOM。

DOM 0級標準是不存在的，它只是 DOM 歷史座標中的一個參照點而已。

瀏覽器對象模型（BOM）

瀏覽器對象模型（BOM，Browser Object Model）是用於瀏覽器的應用程序編程接口（API），它把整個瀏覽器窗口映射爲一個對象。從根本上講，BOM 只處理瀏覽器窗口和框架，但人們習慣上也把全部針對瀏覽器的 JavaScript 擴展算做 BOM 的一部分，例如：

彈出新瀏覽器窗口的功能。
移動、縮放和關閉瀏覽器窗口的功能。
提供瀏覽器詳細信息的 navigator 對象。
提供瀏覽器所加載頁面的詳細信息的 localtion 對象。
提供用戶顯示器分辨率詳細信息的 screen 對象。
對 cookies 的支持。
XMLHttpRequest 和 IE 的 ActiveXObject 這樣的自定義對象。

BOM 最讓人頭疼的是沒有相關的規範和標準，每一個瀏覽器都有獨有的實現，這個問題在 HTML5 中獲得瞭解決，HTML5 致力於把不少 BOM 功能寫入正式規範。

小結

JavaScript 是一種專爲網頁交互而設計的腳本語言，由下列3個不一樣的部分組成：

核心（ECMAScript），由 ECMA-262 定義，提供核心語言功能。
文檔對象模型（DOM），提供訪問和操做網頁內容的方法和接口。
瀏覽器對象模型（BOM），提供與瀏覽器交互的方法和接口。

JavaScript 的這3個組成部分，在當前5個主要瀏覽器（IE、FireFox、Chrome、Safari 和 Opera）中都獲得了不一樣程度的支持。其中，全部瀏覽器對 ECMAScript 3 版本的支持大致上都還不錯，而對 ECMAScript 5 的支持程度愈來愈高，但對 DOM 的支持則彼此相差比較多。對於已經正式歸入 HTML5 標準的 BOM 來講，儘管各瀏覽器都實現了某些衆所周知的共同特性，但其餘特性仍是會因瀏覽器而異。

擴展閱讀「Standard ECMA-262 5.1 Edition 」
www.ecma-international.org/ecma-262/5.…

擴展閱讀「ECMAScript 5 瀏覽器兼容一覽表」
caniuse.mojijs.com/Home/Html/i…

關注微信公衆號「劼哥舍」回覆「答案」，獲取關卡詳解。
關注 github.com/stone0090/j…，獲取最新動態。

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。