ES5

forEach
for-in

ES5 之前

1
2
3

for (var index = 0; index < myArray.length; index++) {
  console.log(myArray[index]);
}

forEach

1
2
3

myArray.forEach(function (value) {
  console.log(value);
});

写法简单了许多，但也有短处：你不能中断循环，是用不了 break。

arr = ["1", "2", "3"]
arr.forEach(function (value) {
    if (value === "2") {
        console.log(5);
        return ;
    }
    console.log(value);
})

输出

1
5
3

中断不了循环。

for–in

for-in 循环实际是为循环 enumerable对象 而设计的。

var obj = {a:1, b:2, c:3};
    
for (var prop in obj) {
  console.log("obj." + prop + " = " + obj[prop]);
}

// 输出:
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

你也可以用它来循环一个数组：

1
2
3

for (var index in myArray) {    // 不推荐这样
  console.log(myArray[index]);
}

不推荐用for-in来循环一个数组，因为，不像对象，数组的index跟普通的对象属性不一样，是重要的数值序列指标。

总之，for–in是用来循环带有字符串key的对象的方法。

for-in 缺点更加明显，它不仅遍历数组中的元素，还会遍历自定义的属性，甚至原型链上的属性都被访问到。而且，遍历数组元素的顺序可能是随机的。

上面的缺点没太懂，不过不碍事，可以直接用 ES6 的 for-of。

ES6 | 循环方法