在 ES6 中，引入了两个新的概念：Iterator 和 Generator。它们为 JavaScript 带来了更强大、更灵活的迭代器和生成器功能，使得我们可以更加方便地处理数据和控制流程。
Iterator
Iterator 是一个对象，它提供了一个统一的访问数据集合的接口，可以遍历集合中的每一个元素，并返回一个包含当前元素的 value 和一个表示是否遍历结束的 done 属性的对象。在 ES6 中，数组、Map、Set、字符串等都实现了 Iterator 接口，可以使用 for...of 循环来遍历它们。
下面是一个示例代码，演示如何使用 for...of 循环遍历数组：
const array = [1, 2, 3];
for (const item of array) {
console.log(item);
}
// 输出：1
// 输出：2
// 输出：3在以上代码中，我们使用 for...of 循环遍历了数组 array，并输出了每个元素的值。
除了 for...of 循环，我们也可以使用 Iterator 的 next() 方法来手动遍历集合中的每一个元素。下面是一个示例代码，演示如何使用 Iterator 的 next() 方法来遍历数组：
// javascriptcn.com 代码示例
const array = [1, 2, 3];
const iterator = array[Symbol.iterator]();
let result = iterator.next();
while (!result.done) {
console.log(result.value);
result = iterator.next();
}
// 输出：1
// 输出：2
// 输出：3在以上代码中，我们首先获取了数组的 Iterator 对象，然后使用 while 循环和 next() 方法来手动遍历数组，并输出每个元素的值。
Generator
Generator 是一个函数，它可以通过 yield 关键字来暂停和恢复函数的执行，并返回一个可遍历的迭代器对象。Generator 函数的执行过程可以被看作是一个状态机，每次执行 yield 关键字时，函数的状态就会被保存，并返回一个包含当前状态的迭代器对象。在调用迭代器对象的 next() 方法时，函数的执行会从上一次暂停的位置继续执行，直到遇到下一个 yield 关键字或函数结束。
下面是一个示例代码，演示如何使用 Generator 函数来生成一个斐波那契数列：
// javascriptcn.com 代码示例
function* fibonacci() {
let [prev, curr] = [0, 1];
while (true) {
[prev, curr] = [curr, prev + curr];
yield curr;
}
}
const iterator = fibonacci();
for (let i = 0; i < 10; i++) {
console.log(iterator.next().value);
}
// 输出：1
// 输出：2
// 输出：3
// 输出：5
// 输出：8
// 输出：13
// 输出：21
// 输出：34
// 输出：55
// 输出：89在以上代码中，我们定义了一个 Generator 函数 fibonacci，它可以生成一个斐波那契数列。我们首先获取了 fibonacci 函数的迭代器对象 iterator，然后使用 for 循环和 next() 方法来遍历数列，并输出每个元素的值。
Generator 函数的使用可以帮助我们更加方便地控制流程和处理数据，例如异步编程、数据处理等场景。
总结
在本文中，我们介绍了 ES6 中的 Iterator 和 Generator，它们为 JavaScript 带来了更强大、更灵活的迭代器和生成器功能，使得我们可以更加方便地处理数据和控制流程。我们通过示例代码演示了如何使用 for...of 循环和 Iterator 的 next() 方法来遍历集合中的每一个元素，以及如何使用 Generator 函数来生成一个斐波那契数列。我们相信，通过学习 Iterator 和 Generator，你可以更加灵活地编写 JavaScript 代码，并提高自己的编程能力。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65846f5bd2f5e1655df1bbe7