ES5，ES6的簡要說明及瀏覽器支援性總結
前端開發離不開javascript語言，而與之密切聯絡的就是ECMAScript。
1.什麼是ECMAScript？
摘自百度百科：ECMAScript是一種由Ecma國際（前身為歐洲計算機制造商協會,英文名稱是European Computer Manufacturers Association）通過ECMA-262標準化的指令碼程式設計語言。下文中就以ES和JS來簡稱。簡單說，ES是JS的一種語言標準。ES正在不斷髮展，目前我們接觸比較多的就是ES5和ES6（ES6也叫ES2015）了。
2.ES5的簡單介紹
2.1 首先說一下相容性問題
從caniuse上面可以查詢到，ES的相容性概覽。
下面就主要瀏覽器進行說明：
IE：可以看到IE6，IE7是完全不支援的。而IE8是隻支援一些內容，參考引用4，IE9是大部分支援，支援度參考引用2。
Chrome：Chrome 23版本之後就是完全支援的了。19~22版本有不相容的地方，參考引用1。
Firefox：Firefox 21版本之後就是完全支援的了。4~20版本有不相容的地方，參考引用1。
其他瀏覽器參考caniuse：
【1】Does not support parseInt() ignoring leading zeros.
【2】Does not support Strict mode.
【3】Does not support zero-width chars in identifiers & Immutable undefined.
【4】IE8 has virtually no ES5 support, but does support Object.defineProperty, Object.getOwnPropertyDescriptor, JSON parsing & Property access on strings.
2.2 ES5有哪些新特性呢？
2.2.1 嚴格模式
嚴格模式是ECMAScript 5的新特性，它允許你把整個程式，或者某個函式，放置在“嚴格”的操作語境中。使用方法是在作用域開頭加上這樣一條語句。
"use strict";- 1
2.2.2 Object新增方法
（1）Object.create() 建立一個具有指定原型且可選擇性地包含指定屬性的物件
Object.create(__proto__, [ propertiesObject ])- 1
（2）Object.getPrototypeOf() 返回該物件的原型
Object.getPrototypeOf(object)
- 1
（3）Object.getOwnPropertyNames() 返回一個由指定物件的所有自身屬性的屬性名（包括不可列舉屬性）組成的陣列
Object.getOwnPropertyNames(object)- 1
（4）Object.keys() 返回一個由給定物件的自身可列舉屬性組成的陣列。而使用for-in 迴圈時，還會列舉其原型鏈上的屬性。
Object.keys(object)- 1
（5）Object.defineProperty() 在一個物件上定義一個新屬性，或者修改一個已經存在的屬性， 並返回這個物件
Object.defineProperty(object, property, descriptor)- 1
（6）Object.defineProperties() 在一個物件上新增或修改一個或者多個自有屬性，並返回該物件
Object.defineProperties(object, properties)- 1
（7）Object.getOwnPropertyDescriptor() 返回物件上一個自有屬性對應的屬性描述符（不需要從原型鏈上進行查詢的屬性）。如果指定的屬性存在於物件上，則返回其屬性描述符（property descriptor），否則返回 undefined
Object.getOwnPropertyDescriptor(object, property)- 1
（8）Object.seal() 密封一個物件，並返回被密封后的物件。密封物件不能新增新的屬性，不能刪除已有屬性，以及不能修改已有屬性的enumerable、configurable、writable，但可以修改已有屬性的value
Object.seal(object)- 1
（9）Object.isSealed() 判斷一個物件是否是密封的
Object.isSealed(object)- 1
（10）Object.freeze() 凍結一個物件，比seal更嚴格，連value都不能修改
Object.freeze(object)- 1
（11）Object.isFrozen() 判斷一個物件是否凍結
Object.isFrozen(object)- 1
（12）Object.preventExtensions() 讓一個物件變成不可擴充套件的，也就是永遠不能再新增新的屬性
Object.preventExtensions(object)- 1
（13）Object.isExtrensible() 判斷一個物件是否是可擴充套件的
Object.isExtrensible(object)- 1
（14）prototype.isPrototypeOf(object) 確定一個物件是否存在於另一個物件的原型鏈中
function Rectangle() {
}
var rec = new Rectangle();
document.write(Rectangle.prototype.isPrototypeOf(rec));- 1
- 2
- 3
- 4
（15）object.propertyIsEnumerable(propertyName) 確定指定的屬性是否可列舉
var a = {};
a.b = 3;
console.log(a.propertyIsEnumerable('b'));
// 輸出是true- 1
- 2
- 3
- 4
2.2.3 Array新增方法
（1）Array.isArray() 用於確定傳遞的值是否是一個 Array
Array.isArray([1, 2, 3]);
// true- 1
- 2
（2）Array.prototype.every(callback[, thisArg]) 測試陣列的所有元素是否都通過了指定函式的測試。
callback：用來測試陣列的每個元素的函式。呼叫時使用引數 (element, index, array)。返回true表示保留該元素（通過測試），false則不保留
thisArg：可選。執行 callback 時的用於 this 的值。
function isBigEnough(element, index, array) {
return (element >= 10);
}
var passed = [12, 5, 8, 130, 44].every(isBigEnough);
// passed is false
passed = [12, 54, 18, 130, 44].every(isBigEnough);
// passed is true- 1
- 2
- 3
- 4
- 5
- 6
- 7
（3）Array.prototype.filter(callback[, thisArg]) 建立一個新陣列, 其包含通過所提供函式實現的測試的所有元素。即是過濾函式。
var a = [1, 2, 3];
var b = a.filter(function(element) {
return element > 2;
});
console.log(b);
//輸出 [3]- 1
- 2
- 3
- 4
- 5
- 6
（4）Array.prototype.forEach(callback[, thisArg]) 對陣列的每個元素執行一次提供的函式。
const arr = ['a', 'b', 'c'];
arr.forEach(function(element) {
console.log(element);
});- 1
- 2
- 3
- 4
（5）Array.prototype.indexOf(searchElement, fromIndex) 返回在陣列中可以找到一個給定元素的第一個索引，如果不存在，則返回-1
let a = [2, 9, 7, 8, 9];
a.indexOf(2); // 0 - 1
- 2
（6）Array.prototype.lastIndexOf() 返回指定元素（也即有效的 JavaScript 值或變數）在陣列中的最後一個的索引，如果不存在則返回 -1。從陣列的後面向前查詢，從 fromIndex 處開始。
var array = [2, 5, 9, 2];
var index = array.lastIndexOf(2);
// index is 3- 1
- 2
- 3
（7）Array.prototype.map() 建立一個新陣列，其結果是該陣列中的每個元素都呼叫一個提供的函式後返回的結果。
var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
// roots的值為[1, 2, 3], numbers的值仍為[1, 4, 9]- 1
- 2
- 3
（8）Array.prototype.reduce() 從左到右為陣列中的每一個元素依次執行callback函式，返回累計處理的結果。
var total = [0, 1, 2, 3].reduce(function(sum, value) {
return sum + value;
}, 0);
// total is 6- 1
- 2
- 3
- 4
（9）Array.prototype.reduceRight() 與Array.prototype.reduce() 的執行方向相反。
（10）Array.prototype.some() 測試陣列中的某些元素是否通過由提供的函式實現的測試。every()是全部元素滿足條件，some()只要任意一個元素滿足條件。
2.2.4 String新增方法
（1）String.prototype.trim() 會從一個字串的兩端刪除空白字元。在這個上下文中的空白字元是所有的空白字元 (space, tab, no-break space 等) 以及所有行終止符字元（如 LF，CR）。
var orig = ' foo ';
console.log(orig.trim()); // 'foo'- 1
- 2
2.2.5 Date新增方法
（1）Date.now() 返回自1970年1月1日 00:00:00 UTC到當前時間的毫秒數。
2.2.6 JSON物件
（1）JSON.parse() 用來解析JSON字串，構造由字串描述的JavaScript值或物件。
let a = '{"b": 3}';
let c = JSON.parse(a);
console.log(c);
// {b: 3}- 1
- 2
- 3
- 4
（2）JSON.stringify() 將一個JavaScript值(物件或者陣列)轉換為一個 JSON字串。
let dd = {bb: 3};
let cc = JSON.stringify(dd);
console.log(cc);
// '{"bb":3}'- 1
- 2
- 3
- 4
上述就是ES5的主要新特性概括，下面我們再看看ES6有哪些新特性。
3. ES6（ES2015）的簡要說明
ES6各個特性的支援情況比較細，可根據具體特性查詢caniuse
3.1 ES6新特性
參考文件：http://es6.ruanyifeng.com/#docs/intro（ECMAScript 6 入門）
下面簡單說一些比較常見的ES6用法
（1）let 用來宣告變數。它的用法類似於var，但是所宣告的變數，只在let命令所在的程式碼塊內有效。實際上為 JavaScript 新增了塊級作用域。
{
let a = 10;
var b = 1;
}
a; // ReferenceError: a is not defined.
b; // 1- 1
- 2
- 3
- 4
- 5
- 6
（2）const宣告一個只讀的常量。一旦宣告，常量的值就不能改變。
const PI = 3.1415;
PI // 3.1415
PI = 3;
// TypeError: Assignment to constant variable.- 1
- 2
- 3
- 4
- 5
（3）陣列的解構賦值
let [a, b, c] = [1, 2, 3];
// let a=1,b=2,c=3;- 1
- 2
（4）物件的解構賦值
let { foo, bar } = { foo: "aaa", bar: "bbb" };
foo // "aaa"
bar // "bbb"- 1
- 2
- 3
（5）箭頭函式 =>
var f = v => v;- 1
等效於
var f = function(v) {
return v;
};- 1
- 2
- 3
（6）Promise物件是非同步程式設計的一種解決方案。Promise物件代表一個非同步操作，有三種狀態：pending（進行中）、fulfilled（已成功）和rejected（已失敗）。
基本用法是，建立一個Promise例項，
const promise = new Promise(function(resolve, reject) {
// ... some code
if (/* 非同步操作成功 */){
resolve(value);
} else {
reject(error);
}
});- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
Promise例項生成以後，可以用then方法分別指定resolved狀態和rejected狀態的回撥函式。
promise.then(function(value) {
// success
}, function(error) {
// failure
});- 1
- 2
- 3
- 4
- 5
（7）Class語法：
包括constructor，get，set等經典函式方法。
（8）Module語法：
包括import，export等經典模組引入和匯出寫法。