淺談JavaScript、ES5、ES6

什麼是JavaScript

JavaScript一種動態類型、弱類型、基於原型的客戶端腳本語言，用來給HTML網頁增加動態功能。（好吧，概念什麼最討厭了）

動態：

在運行時確定數據類型。變數使用之前不需要類型聲明，通常變數的類型是被賦值的那個值的類型。

弱類：

計算時可以不同類型之間對使用者透明地隱式轉換，即使類型不正確，也能通過隱式轉換來得到正確的類型。

原型：

新對象繼承對象（作為模版），將自身的屬性共享給新對象，模版對象稱為原型。這樣新對象實例化後不但可以享有自己創建時和運行時定義的屬性，而且可以享有原型對象的屬性。

PS：新對象指函數，模版對象是實例對象，實例對象是不能繼承原型的，函數才可以的。

JavaScript由三部分組成：

1、ECMAScript（核心）

作為核心，它規定了語言的組成部分：語法、類型、語句、關鍵字、保留字、操作符、對象

PS：*不完全兼容的實現

2、DOM（文檔對象模型）

DOM把整個頁面映射為一個多層節點結果，開發人員可藉助DOM提供的API，輕鬆地刪除、添加、替換或修改任何節點。

PS：DOM也有級別，分為DOM1、DOM2、DOM3，拓展不少規範和新介面。

3、BOM （瀏覽器對象模型）

支持可以訪問和操作瀏覽器窗口的瀏覽器對象模型，開發人員可以控制瀏覽器顯示的頁面以外的部分。

什麼是ES5

作為ECMAScript第五個版本（第四版因為過於複雜廢棄了），瀏覽器支持情況可看第一副圖，增加特性如下。

1、strict模式

嚴格模式，限制一些用法， use strict ;

2、Array增加方法

增加了every、some 、forEach、filter 、indexOf、lastIndexOf、isArray、map、reduce、reduceRight方法

3. Object方法

Object.getPrototypeOf

Object.create

Object.getOwnPropertyNames

Object.defineProperty

Object.getOwnPropertyDescriptor

Object.defineProperties

Object.keys

Object.preventExtensions / Object.isExtensible

Object.seal / Object.isSealed

Object.freeze / Object.isFrozen

PS：只講有什麼，不講是什麼。

什麼是ES6

ECMAScript6在保證向下兼容的前提下，提供大量新特性，目前瀏覽器兼容情況如下：

ES6特性如下：

1、塊級作用域 關鍵字let, 常量const

2、對象字面量的屬性賦值簡寫（property value shorthand）

3、賦值解構

4、函數參數 - 默認值、參數打包、 數組展開（Default 、Rest 、Spread）

5、箭頭函數 Arrow functions

(1).簡化了代碼形式，默認return表達式結果。

(2).自動綁定語義this，即定義函數時的this。如上面例子中，forEach的匿名函數參數中用到的this。

6、字元串模板 Template strings

7、Iterators（迭代器）+ for..of

迭代器有個next方法，調用會返回：

(1).返回迭代對象的一個元素：{ done: false, value: elem }

(2).如果已到迭代對象的末端：{ done: true, value: retVal }

8、生成器 （Generators）

9、Class

Class，有constructor、extends、super，但本質上是語法糖（對語言的功能並沒有影響，但是更方便程序員使用）。

10、Modules

ES6的內置模塊功能借鑒了CommonJS和AMD各自的優點：

(1).具有CommonJS的精簡語法、唯一導出出口(single exports)和循環依賴(cyclic dependencies)的特點。

(2).類似AMD，支持非同步載入和可配置的模塊載入。

11、Map + Set + WeakMap + WeakSet

四種集合類型，WeakMap、WeakSet作為屬性鍵的對象如果沒有別的變數在引用它們，則會被回收釋放掉。

12、Math + Number + String + Array + Object APIs

一些新的API

13、Proxies

使用代理（Proxy）監聽對象的操作，然後可以做一些相應事情。

可監聽的操作： get、set、has、deleteProperty、apply、construct、getOwnPropertyDescriptor、defineProperty、getPrototypeOf、setPrototypeOf、enumerate、ownKeys、preventExtensions、isExtensible。

14、Symbols

Symbol是一種基本類型。Symbol 通過調用symbol函數產生，它接收一個可選的名字參數，該函數返回的symbol是唯一的。

、

15、Promises

Promises是處理非同步操作的對象，使用了 Promise 對象之後可以用一種鏈式調用的方式來組織代碼，讓代碼更加直觀（類似jQuery的deferred 對象）。

總結

對於ES6，在某些方式是不是重蹈ES4的覆轍，變得複雜了；又或許幾年後大家的接受能力變強了，覺得是應該這樣了。我覺得還是不錯的，因為它們是向下兼容的，即使複雜語法不會用，也能用自己熟知的方式，提供的語法糖也都挺實際。

這一篇幅有些長了，就到此為止了。這一篇文章旨在講有什麼，應該是包含絕大多數內容，但沒有做詳細分析，部分內容來自網上資料，就不一一列出了。

本文為原創文章，轉載請保留原出處，方便溯源，如有錯誤地方，謝謝指正。

本文地址 ：http://www.cnblogs.com/lovesong/p/4908871.html

點擊展開全文

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！