ES6中Iterator与for..of..遍历用法分析

本文旨在深入ES6中的Iterator与for...of遍历的用法，结合实例，为读者呈现一个生动且易于理解的教程。

一、Iterator概念及用法

在ES6中，遍历器（Iterator）作为一种接口，为不同的数据结构提供了统一的访问机制。为了更好地理解这个概念，我们可以自己创建一个简单的Iterator。

例如：

```javascript

var it = simIteractor(['hi','ES5']);

console.log(it.next()); // 输出：{value: "hi", done: false}

console.log(it.next()); // 输出：{value: "ES5", done: false}

console.log(it.next()); // 输出：{value: undefined, done: true}

function simIteractor(array){

var nextIndex = 0;

return {

next: function(){

return nextIndex < array.length ? {value: array[nextIndex++], done: false} : {value: undefined, done: true};

}

};

}

```

在ES6中，默认的Iterator接口部署在数据结构的Symbol.iterator属性上。数组、某些类似数组的对象、Set及Map等数据结构原生具备Iterator接口。

二、for...of...遍历的用法与技巧

说到可遍历，就要说到遍历的方法。在ES6中，for...of...循环是一种非常实用的遍历方法。

1. for...of...循环用于遍历数据，例如数组中的值。相较于传统的for循环和for-in循环，for-of循环更加直观且易于使用。

2. for-of循环不仅支持数组的遍历，还支持大多数类数组对象，如DOMNodeList。这使得它在某些场景下比for-in循环更为适用。

3. for-of循环还可以将字符串视为一系列的Unicode字符进行遍历，这是其独特之处。例如：

```javascript

for (var chr of "abc"){

alert(chr); // 依次弹出a,b,c

}

```

4. for-of循环同样支持Map和Set对象的遍历。如果你还不熟悉Map和Set，那么我强烈建议你深入了解这两个数据结构，它们与for-of循环的结合使用将会为你带来极大的便利。

总结，本文通过实例详细阐述了ES6中的Iterator与for...of遍历的用法。希望本文能对大家在ECMAScript程序设计方面的学习有所帮助。如果你有任何疑问或需要进一步的解释，请随时与我们联系。

注：本文内容仅供参考与学习交流，如有错误或不完整之处，请谅解并指正。感谢阅读！