for each...in for...in for...of
for each...in
使用一個變量叠代一個對象的所有屬性值,對於每一個屬性值,有一個指定的語句塊被執行.
for each...in 是 ECMA-357 (E4X) 標準的一部分, 大部分非Mozilla瀏覽器都沒有實現該標準, E4X並不是 ECMAScript 標準的一部分.
作為ECMA-357(E4X)標準的一部分,for each...in語句已被廢棄,E4X中的大部分特性已被刪除,但考慮到向後兼容,for each...in只會被禁用而不會被刪除,可以使用ES6中新的for...of語句來代替.
語法：
for each (variable in object) {
statement
}
參數：
variable- 用來遍歷屬性值的變量,前面的
var關鍵字是可選的.該變量是函數的局部變量而不是語句塊的局部變量.
object- 該對象的屬性值會被遍歷.
statement- 遍歷屬性值時執行的語句. 如果想要執行多條語句, 請用(
{ ... }) 將多條語句括住.
一些對象的內置屬性是無法被遍歷到的,包括所有的內置方法,例如String對象的indexOf方法.不過,大部分的用戶自定義屬性都是可遍歷的.
警告:永遠不要使用for each...in語句遍歷數組,僅用來遍歷常規對象。
for...in
以任意順序遍歷一個對象的可枚舉屬性。對於每個不同的屬性，語句都會被執行。
語法：
for (variable in object) {...}
參數：
variable- 在每次叠代時,將不同的屬性名分配給變量。
object- 被叠代其枚舉屬性的對象。
for..in 不應該被用來叠代一個下標順序很重要的 Array .
數組索引僅是可枚舉的整數名，其他方面和別的普通對象屬性沒有什麽區別。for...in 並不能夠保證返回的是按一定順序的索引，但是它會返回所有可枚舉屬性，包括非整數名稱的和繼承的。
因為叠代的順序是依賴於執行環境的，所以數組遍歷不一定按次序訪問元素。 因此當叠代那些訪問次序重要的 arrays 時用整數索引去進行 for 循環 (或者使用 Array.prototype.forEach()
for...of 循環) 。
僅叠代自身的屬性
如果你只要考慮對象本身的屬性，而不是它的原型，那麽使用 getOwnPropertyNames() 或執行 hasOwnProperty() 來確定某屬性是否是對象本身的屬性 (也能使用propertyIsEnumerable)。另外，如果你知道外部不存在任何的幹擾代碼，你可以擴展內置原型與檢查方法。
var obj = {a:1, b:2, c:3};
for (var prop in obj) {
console.log("obj." + prop + " = " + obj[prop]);
}
// Output:
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"
var triangle = {a:1, b:2, c:3};
function ColoredTriangle() {
this.color = "red";
}
ColoredTriangle.prototype = triangle;
var obj = new ColoredTriangle();
for (var prop in obj) {
if( obj.hasOwnProperty( prop ) ) {
console.log("o." + prop + " = " + obj[prop]);
}
}
// Output:
// "o.color = red"
for...of
ECMAScript 6新方法，使用時參考https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/for...of
- for...of - 一個相似的語法,用來遍歷可叠代對象,有時候效果等同於
for each...in語句. - 對於
for...of的循環，可以由break,throw或return終止。在這些情況下，叠代器關閉。 -
不要重用生成器
生成器不應該重用，即使
for...of循環的提前終止，例如通過break關鍵字。在退出循環後，生成器關閉，並嘗試再次叠代，不會產生任何進一步的結果。
for each...in for...in for...of