[ES6深度解析]2：迭代器（Iterators ）和for of循环

Posted 2021-08-20 MAX力出奇迹

旧版本for循环

如何循环遍历数组中的元素?20年前，当javascript被引入时，你会这样做:

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

从ES5开始，你就可以使用内置的forEach方法:

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

这个版本稍微短一些，但有一个小缺点:不能使用break语句跳出这个循环，也不能使用return语句从封闭函数返回。如果有一个简洁的for循环语法来循环数组元素，那就太好了。

for-in循环怎么样?

for (var index in myArray) {    //不要这么做
  console.log(myArray[index]);
}

这不是个好办法，原因如下:

• 在这段代码中，分配给index的值是字符串“0”、“1”、“2”等等，而不是实际的数字。由于不想触发字符串算术(“2”+ 1 ==“21”)，这方式是不方便的。
• 循环体不仅会对数组元素执行，还会对其他人添加的任何其他expando属性执行。例如，如果你的数组有一个可枚举的属性myArray.name，那么这个循环将额外执行一次index == "name"。甚至可以访问数组原型链上的属性。
• 最令人惊讶的是，在某些情况下，该代码可以以任意顺序循环遍历数组元素。
  简而言之，for-in被设计用于带有字符串键的普通旧对象。对于数组，就没那么好了。

强大的for-of循环

ES6承诺不会破坏你已经编写的JS代码。数以百万计的网站依赖于for-in的行为，甚至它在数组上的行为。因此，在数组中使用for-in时，修复for-in并没有什么问题。ES6改进问题的唯一方法是添加某种新的循环语法。这就是：

for (var value of myArray) {
  console.log(value);
}

• 这是迄今为止最简洁、最直接的数组元素循环语法
• 它避免了for-in的所有陷阱
• 与forEach()不同，它使用break、continue和return

for - in循环用于遍历对象属性。
for - of循环用于遍历数据，比如数组中的值。

其他集合也支持for-of

for - of不仅仅适用于数组。它也适用于大多数数组类对象，如DOM节点列表。它也适用于字符串，将字符串作为Unicode字符序列处理:

for (var chr of "
以上是关于[ES6深度解析]2：迭代器（Iterators ）和for of循环的主要内容，如果未能解决你的问题，请参考以下文章
 
 Python标准模块--Iterators和Generators
 Amphp之Iterators（迭代器）
 Amphp之Iterators（迭代器）
 Iterators与enumerations的不同
 STL源码剖析——iterators与trait编程#2 Traits编程技法
 Iterables vs. Iterators vs. Generators(可迭代对象，迭代器，生成器)