js中的循环遍历数组中的元素，ES6（for-of）、ES5（forEach、for-in）、通用（for（i=0；i<length;i++））

我们如何遍历数组中的元素？

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

ES5

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

缺点：你不能使用break语句中断循环，也不能使用return语句返回到外层函数。

那么，你一定想尝试一下for-in循环：

for (var index in myArray) { // 千万别这样做
console.log(myArray[index]);
}

这绝对是一个糟糕的选择，为什么呢？

在这段代码中，赋给index的值不是实际的数字，而是字符串“0”、“1”、“2”，此时很可能在无意之间进行字符串算数计算，例如：“2” + 1 == “21”，这给编码过程带来极大的不便。
作用于数组的for-in循环体除了遍历数组元素外，还会遍历自定义属性。举个例子，如果你的数组中有一个可枚举属性myArray.name，循环将额外执行一次，遍历到名为“name”的索引。就连数组原型链上的属性都能被访问到。
最让人震惊的是，在某些情况下，这段代码可能按照随机顺序遍历数组元素。
简而言之，for-in是为普通对象设计的，你可以遍历得到字符串类型的键，因此不适用于数组遍历。

ES6

强大的for-of循环

for (var value of myArray) {

console.log(value);

}

是的，与之前的内建方法相比，这种循环方式看起来是否有些眼熟？那好，我们将要探究一下for-of循环的外表下隐藏着哪些强大的功能。现在，只需记住：

这是最简洁、最直接的遍历数组元素的语法
这个方法避开了for-in循环的所有缺陷
与forEach()不同的是，它可以正确响应break、continue和return语句

for-in循环用来遍历对象属性、遍历数据—例如数组中的值、遍历其它的集合、DOM NodeList、字符。

for (var chr of "") {
alert(chr);
}

举个例子，新加入的for-of循环像极了C++、Java、C#以及Python中的循环语句。与它们一样，这里的for-of循环支持语言和标准库中提供的几种不同的数据结构。它同样也是这门语言中的一个扩展点（译注：关于扩展点，建议参考 1. 浅析扩展点 2. What are extensions and extension points?）。

正如其它语言中的for/foreach语句一样，for-of循环语句通过方法调用来遍历各种集合。

目前，对于for-of循环新特性，所有最新版本Firefox都（部分）支持（译注：从FF 13开始陆续支持相关功能，FF 36 - FF 40基本支持大部分特性），在Chrome中可以通过访问 chrome://flags 并启用“实验性JavaScript”来支持。微软的Spartan浏览器支持，但是IE不支持。如果你想在web环境中使用这种新语法，同时需要支持IE和Safari，你可以使用Babel或Google的Traceur这些编译器来将你的ES6代码翻译为Web友好的ES5代码。