ECMAScript5新特性總結

雖然ECMAScript5早就成為標准推出來了，但之前因為一直用的是ECMAScript3,並且工作中總是要求兼容IE的低版本，所以用的比較少。如今市場上大多數瀏覽器都能兼容ECMAScript5(IE8除外)，逐漸的就用的比較多了。今天主要是把ECMAScript5中新增奶的特性及方法總結一下，已備需要時方便查詢。

ECMAScript5的兼容性可參見http://kangax.github.io/compat-table/es5/

嚴格模式（Strict Mode）是ECMAScript 5的新特性，它允許你把整個程序，或者某個函數，放置在“嚴格”的操作語境中。這種嚴格的語境會防止某些特定的操作並拋出更多的異常。嚴格模式下主要變化有：

1. 未使用var創建的變量會報錯
2. 函數頂層的this不在指向window，而是undefined
3. 強制為eval創建新作用域
4. 禁止用delete刪除變量
5. 禁止使用arguments,callee,caller屬性
6. 禁止使用width語句
7. 禁止函數參數重名
8. 禁止對象屬性重名
9. 禁止使用八進制數字
10. 不允許在非函數的代碼塊內聲明函數。
11. 新增保留字：implements, interface, let, package, private, protected, public, static, yield。

Object新增方法：

Object.create()

創建一個具有指定原型且可選擇性地包含指定屬性的對象

Object.create(proto, [ propertiesObject ])

proto:一個對象，作為新創建對象的原型。或者為 null。
propertiesObject:可選。該參數對象是一組屬性與值，該對象的屬性名稱將是新創建的對象的屬性名稱，值是屬性描述符。注意：該參數對象不能是 undefined，另外只有該對象中自身擁有的可枚舉的屬性才有效，也就是說該對象的原型鏈上屬性是無效的。
示例：

//Shape - superclass
function Shape() {
  this.x = 0;
  this.y = 0;
}

Shape.prototype.move = function(x, y) {
    this.x += x;
    this.y += y;
    console.info("Shape moved.");
};

// Rectangle - subclass
function Rectangle() {
  Shape.call(this); //call super constructor.
}

Rectangle.prototype = Object.create(Shape.prototype);

var rect = new Rectangle();
rect instanceof Rectangle //true.
rect instanceof Shape //true.
rect.move(1, 1); //Outputs, "Shape moved."

Object.getPrototypeOf()

返回該對象的原型(也就是該對象內部屬性[[prototype]]的值)

Object.getPrototypeOf(object)

在 ES5 中，如果參數不是一個對象類型，將拋出一個 TypeError 異常。在ES6中，參數被強制轉換為Object。
示例：

var proto = {};
var obj = Object.create(proto);
Object.getPrototypeOf(obj) === proto; // true

Object.getOwnPropertyNames()

返回一個由指定對象的所有自身屬性的屬性名（包括不可枚舉屬性）組成的數組。

Object.getOwnPropertyNames(obj)

obj:一個對象，其自身的可枚舉和不可枚舉屬性的名稱被返回。
示例：

var arr = ["a", "b", "c"];
console.log(Object.getOwnPropertyNames(arr).sort()); // ["0", "1", "2", "length"]

Object.defineProperty()

直接在一個對象上定義一個新屬性，或者修改一個已經存在的屬性， 並返回這個對象。

Object.defineProperty(obj, prop, descriptor)

obj:需要定義屬性的對象。
prop:需定義或修改的屬性的名字。
descriptor:將被定義或修改的屬性的描述符。
示例：

Object.defineProperty(obj, "key", {
  enumerable: false,
  configurable: false,
  writable: false,
  value: "static"
});

Object.defineProperties()

在一個對象上添加或修改一個或者多個自有屬性，並返回該對象。

Object.defineProperties(obj, props)

obj:將要被添加屬性或修改屬性的對象
props:該對象的一個或多個鍵值對定義了將要為對象添加或修改的屬性的具體配置
示例：

var obj = {};
Object.defineProperties(obj, {
  "property1": {
    value: true,
    writable: true
  },
  "property2": {
    value: "Hello",
    writable: false
  }
});
console.log(obj) //{property1:true,property2:"Hello"}

Object.getOwnPropertyDescriptor()

指定對象上一個自有屬性對應的屬性描述符（自有屬性指的是直接賦予該對象的屬性，不需要從原型鏈上進行查找的屬性）。如果指定的屬性存在於對象上，則返回其屬性描述符（property descriptor），否則返回 undefined。

Object.getOwnPropertyDescriptor(obj, prop)

obj:在該對象上查看屬性
prop:一個屬性名稱，該屬性的屬性描述符將被返回
示例：

var o, d;
o = { bar: 42 };
d = Object.getOwnPropertyDescriptor(o, "bar");
console.log(d);//{ configurable: true, enumerable: true, value: 42, writable: true }

Object.seal()

可以讓一個對象密封，並返回被密封后的對象。密封對象是指那些不能添加新的屬性，不能刪除已有屬性，以及不能修改已有屬性的可枚舉性、可配置性、可寫性，但可能可以修改已有屬性的值的對象。

Object.seal(obj)

Object.freeze()

可以凍結一個對象，凍結指的是不能向這個對象添加新的屬性，不能修改其已有屬性的值，不能刪除已有屬性，以及不能修改該對象已有屬性的可枚舉性、可配置性、可寫性。也就是說，這個對象永遠是不可變的。該方法返回被凍結的對象。

Object.freeze(obj)

Object.preventExtensions()

讓一個對象變的不可擴展，也就是永遠不能再添加新的屬性。

Object.preventExtensions(obj)

Object.isExtrensible()

判斷一個對象是否是可擴展的（是否可以在它上面添加新的屬性）。

Object.isExtensible(obj)

示例：

// 新對象默認是可擴展的.
var empty = {};
Object.isExtensible(empty); // === true
// ...可以變的不可擴展.
Object.preventExtensions(empty);
Object.isExtensible(empty); // === false

Object.isSealed()

判斷一個對象是否是密封的（sealed）。

Object.isSealed(obj)

示例：

// 新建的對象默認不是密封的.
var empty = {};
Object.isSealed(empty); // === false

// 如果你把一個空對象變的不可擴展,則它同時也會變成個密封對象.
Object.preventExtensions(empty);
Object.isSealed(empty); // === true

Object.isFrozen()

判斷一個對象是否被凍結（frozen）。

Object.isFrozen(obj)

Object.keys()

返回一個由給定對象的自身可枚舉屬性組成的數組，數組中屬性名的排列順序和使用 for...in 循環遍歷該對象時返回的順序一致 （兩者的主要區別是 一個 for-in 循環還會枚舉其原型鏈上的屬性）。

Object.keys(obj)

示例：

var arr = ["a", "b", "c"];
console.log(Object.keys(arr));// [ '0', '1', '2' ]

Object.prototype新增方法

Object.prototype.isPrototypeOf()

用於測試一個對象是否存在於另一個對象的原型鏈上。

Obj.prototype.isPrototypeOf(object)

object:在該對象的原型鏈上搜尋
示例：

var arr = [];
console.log(arr instanceof Array);//true
console.log(Array.prototype.isPrototypeOf(arr));//true

isPrototypeOf 和 instanceof operator 是不一樣的。在表達式 object instanceof AFunction 中，檢測的是 AFunction.prototype 是否在object 的原型鏈中，而不是檢測 AFunction 自身。

Object.prototype.propertyIsEnumerable()

返回一個布爾值，表明指定的屬性名是否是當前對象可枚舉的自身屬性。

obj.propertyIsEnumerable(prop)

示例：

var o = {};
o.prop = 'is enumerable';
o.propertyIsEnumerable('prop');   //  返回 true

Function.prototype新增方法

Function.prototype.bind()

bind()方法會創建一個新函數。當這個新函數被調用時，bind()的第一個參數將作為它運行時的 this, 之后的一序列參數將會在傳遞的實參前傳入作為它的參數。

fun.bind(thisArg[, arg1[, arg2[, ...]]])

thisArg:當綁定函數被調用時，該參數會作為原函數運行時的 this 指向。當使用new 操作符調用綁定函數時，該參數無效。
arg1, arg2, ...:當綁定函數被調用時，這些參數將置於實參之前傳遞給被綁定的方法。

示例：

this.x = 9; 
var module = {
  x: 81,
  getX: function() { return this.x; }
};
module.getX(); // 返回 81
var retrieveX = module.getX;
retrieveX(); // 返回 9, 在這種情況下，"this"指向全局作用域
// 創建一個新函數，將"this"綁定到module對象
// 新手可能會被全局的x變量和module里的屬性x所迷惑
var boundGetX = retrieveX.bind(module);
boundGetX(); // 返回 81

Array新增方法：

Array.isArray()

該方法適用於確定傳遞的值是否為Array。

Array.isArray(obj)

示例：

Array.isArray([1, 2, 3]);  // true
Array.isArray({foo: 123}); // false
Array.isArray("foobar");   // false
Array.isArray(undefined);  // false

位置方法：

Array.prototype.indexOf()

返回在數組中可以找到給定元素的第一個索引，如果不存在，則返回-1。

arr.indexOf(searchElement)

示例：

var a = [2, 9, 9]; 
a.indexOf(2); // 0 

Array.prototype.lastIndexOf()

返回指定元素（也即有效的 JavaScript 值或變量）在數組中的最后一個的索引，如果不存在則返回 -1。從數組的后面向前查找，從 fromIndex 處開始。

arr.lastIndexOf(searchElement[, fromIndex = arr.length - 1])

searchElement:被查找的元素。
fromIndex:從此位置開始逆向查找。默認為數組的長度減 1，即整個數組都被查找。如果該值大於或等於數組的長度，則整個數組會被查找。如果為負值，將其視為從數組末尾向前的偏移。即使該值為負，數組仍然會被從后向前查找。如果該值為負時，其絕對值大於數組長度，則方法返回 -1，即數組不會被查找。

示例：

var array = [2, 5, 9, 2];
var index = array.lastIndexOf(2);//3

迭代方法：

Array.prototype.every()

測試數組的所有元素是否都通過了指定函數的測試。
every 方法為數組中的每個元素執行一次 callback 函數，直到它找到一個使 callback 返回 false（表示可轉換為布爾值 false 的值）的元素。如果發現了一個這樣的元素，every 方法將會立即返回 false。否則，callback 為每一個元素返回 true，every 就會返回 true。

arr.every(callback[, thisArg])

callback:用來測試每個元素的函數。
thisArg:執行 callback 時使用的 this 值。

示例：

function isBigEnough(element, index, array) {
  return (element >= 10);
}
var passed = [12, 5, 8, 130, 44].every(isBigEnough);// false
passed = [12, 54, 18, 130, 44].every(isBigEnough);// true

Array.prototype.some()

測試數組中的某些元素是否通過了指定函數的測試。
some 為數組中的每一個元素執行一次 callback 函數，直到找到一個使得 callback 返回一個“真值”（即可轉換為布爾值 true 的值）。如果找到了這樣一個值，some 將會立即返回 true。否則，some 返回 false。

arr.some(callback[, thisArg])

示例：

function isBigEnough(element, index, array) {
  return (element >= 10);
}
var passed = [2, 5, 8, 1, 4].some(isBigEnough);
// passed is false
passed = [12, 5, 8, 1, 4].some(isBigEnough);
// passed is true

Array.prototype.filter()

使用指定的函數測試所有元素，並創建一個包含所有通過測試的元素的新數組。
filter 為數組中的每個元素調用一次 callback 函數，並利用所有使得 callback 返回 true 或 等價於 true 的值 的元素創建一個新數組。

var new_arrary = arr.filter(callback[, thisArg])

示例：

function isBigEnough(value) {
  return value >= 10;
}

var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);//[12, 130, 44]

Array.prototype.forEach()

方法對數組的每個元素執行一次提供的函數。

array.forEach(callback[, thisArg])

示例：

var a = ['a', 'b', 'c'];

a.forEach(function(element) {
    console.log(element);
});
// a
// b
// c

forEach() 為每個數組元素執行callback函數；不像map() 或者reduce() ，它總是返回 undefined值，並且不可鏈式調用。

Array.prototype.map()

創建一個新數組，其結果是該數組中的每個元素調用一個提供的函數。
map 方法會給原數組中的每個元素都按順序調用一次 callback 函數。callback 每次執行后的返回值（包括 undefined）組合起來形成一個新數組。

var new_array = arr.map(callback[, thisArg])

示例：

var numbers = [1, 5, 10, 15];
var roots = numbers.map(function(x) {
    return x * 2;
});
// roots is now [2, 10, 20, 30]
// numbers is still [1, 5, 10, 15]

歸並方法：

Array.prototype.reduce()

對累加器和數組的每個值 (從左到右)應用一個函數，以將其減少為單個值。

arr.reduce(callback,[initialValue])

callback:執行數組中每個值的函數，包含四個參數
accumulator:上一次調用回調返回的值，或者是提供的初始值（initialValue）
currentValue:數組中正在處理的元素
currentIndex:數據中正在處理的元素索引，如果提供了 initialValue ，從0開始；否則從1開始
array:調用 reduce 的數組
initialValue:可選項，其值用於第一次調用 callback 的第一個參數。

示例：

var sum = [0, 1, 2, 3].reduce(function(acc, val) {
  return acc + val;
}, 0);

console.log(sum);// 6

Array.prototype.reduceRight();

reduceRight() 方法接受一個函數作為累加器（accumulator），讓每個值（從右到左，亦即從尾到頭）縮減為一個值。（與 reduce() 的執行方向相反）

arr.reduceRight(callback[, initialValue])

示例：

var flattened = [[0, 1], [2, 3], [4, 5]].reduceRight(function(a, b) {
    return a.concat(b);
}, []);
// flattened is [4, 5, 2, 3, 0, 1]

String

String.trim()

會刪除一個字符串兩端的空白字符。

var newStr = str.trim()

示例：

var orig = '   foo  ';
console.log(orig.trim()); // 'foo'

Date

Date.now()

返回自1970年1月1日 00:00:00 UTC到當前時間的毫秒數。

var timeInMs = Date.now();

IE8及以下可以用以下代碼來兼容：

if (!Date.now) {
  Date.now = function now() {
    return new Date().getTime();
  };
}

Date.prototype.toISOString()

返回一個 ISO（ISO 8601 Extended Format）格式的字符串： YYYY-MM-DDTHH:mm:ss.sssZ。時區總是UTC（協調世界時），加一個后綴“Z”標識。

dateObj.toISOString()

示例：

var today = new Date("05 October 2011 14:48 UTC");
console.log(today.toISOString()); // 返回2011-10-05T14:48:00.000Z

JSON

JSON.parse()

解析一個JSON字符串，構造由字符串描述的JavaScript值或對象。可以提供可選的reviver函數以在返回之前對所得到的對象執行變換。

JSON.parse(text[, reviver])

text:要被解析成JavaSctipt值的字符串，查看 JSON 對象學習的JSON 語法的說明。
reviver: 可選,如果是一個函數，則規定了原始值如何被解析改造，在被返回之前。

示例：

JSON.parse('{"name" : "jesse","age":25 }');//{ name: 'jesse', age: 25 }

JSON.stringfy()

JSON.stringify() 方法將JavaScript值轉換為JSON字符串

JSON.stringify(value[, replacer [, space]])

示例：

JSON.stringify({ name: 'jesse', age: 25 });//{"name":"jesse","age":25}