谈谈迭代器 Iterator 与生成器 Generator，掌握迭代的本质，纵横 JavaScript

2023-11-01 18:06:42

作为一名 JavaScript 开发者，我们经常需要遍历数据结构。使用 for 循环或 for...of 循环是我们常用的遍历方式。但是，迭代器 Iterator 和生成器 Generator 能够提供更加灵活和强大的遍历机制。

迭代器 Iterator：是什么？怎么做？

迭代器是一个对象，它符合迭代器协议，即拥有 next 方法，该方法返回一个包含 value 和 done 属性的对象。value 属性是迭代器当前指向的元素的值，done 属性是一个布尔值，表示迭代是否已完成。

创建一个迭代器非常简单，我们可以使用 JavaScript 的 Symbol.iterator 方法。该方法返回一个实现了迭代器协议的对象，我们可以使用它来遍历数据结构。

const numbers = [1, 2, 3, 4, 5];
const iterator = numbers[Symbol.iterator]();

while (true) {
  const result = iterator.next();
  if (result.done) {
    break;
  }
  console.log(result.value);
}

上面的代码将遍历 numbers 数组并打印出每个元素。

生成器 Generator：是什么？怎么做？

生成器是一个函数，它可以暂停并恢复执行。当我们调用生成器时，它会返回一个迭代器，我们可以使用这个迭代器来遍历生成器产生的值。

创建一个生成器非常简单，我们可以使用 JavaScript 的 function* 语法。

function* numbersGenerator() {
  for (let i = 1; i <= 5; i++) {
    yield i;
  }
}

const generator = numbersGenerator();
const iterator = generator();

while (true) {
  const result = iterator.next();
  if (result.done) {
    break;
  }
  console.log(result.value);
}