ES6中for..of的妙用

你是如何遍历数组中的元素的？20年前JavaScript刚进入视野时，你应该是这样写的：

[js]  view plain copy

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

直到ES5中原生JavaScript中添加了forEach方法：

[js]  view plain copy

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

语法上简洁了一些，但是它有一个小小的不足：你不能用break语句跳出循环且不能在这个封闭的函数内使用return语句。

如果有一个简单的for-loop语法来遍历数组就好了。

使用一个for-in循环怎么样？

[js]  view plain copy

1. for (var index in myArray) {     // don't actually do this   
2.   
3.     console.log(myArray[index]);   
4. }  

我用几个理由来说明这并不是一个好主意：

• 数组的索引值index是String类型的“0”，“1”，“2”等等，而不是Number类型。当你进行算术运算时（“2”+1==“21”）也许并不是你期望的结果，所以运算前需要类型转换，这很不方便。
• 循环体不仅会遍历数组的元素，甚至连expando属性也遍历出来了。举个例子，如果你的myArray数组中有一个叫做name的属性，遍历时就将 index ==”name”也遍历出来，这样就多了一次执行。即时这些属性在数组的原型链上是可直接访问的。
• 最让人无语的是，在某些情况下，这段代码在遍历数组元素时顺序是任意的。