JavaScript迭代器与生成器原理-js教程-PHP中文网

JavaScript迭代器与生成器原理

幻影之瞳

发布： 2025-10-25 11:45:02

原创

461人浏览过

迭代器是实现next方法并返回value和done的对象，用于遍历数据序列；2. 实现Symbol.iterator方法可使对象可迭代，支持for...of遍历；3. 生成器函数通过yield简化迭代器创建，自动提供next方法。

javascript迭代器与生成器原理

JavaScript中的迭代器和生成器是处理数据序列的重要工具，理解它们的原理有助于写出更高效、可读性更强的代码。

迭代器（Iterator）是什么

迭代器是一种设计模式，它允许你访问一个集合中的元素，而不需要暴露其底层结构。在JavaScript中，迭代器是一个对象，它实现了 next() 方法，该方法返回一个包含 value 和 done 两个属性的对象：

value：当前步骤的值，可以是任意类型
done：布尔值，表示遍历是否结束

当 done 为 true 时，表示迭代完成，此时 value 可能存在也可能为 undefined。

要让一个对象变成可迭代的，需要实现 [Symbol.iterator] 方法，该方法必须返回一个迭代器对象。数组、字符串、Map、Set 等原生对象都内置了这个方法，因此可以用 for...of 遍历。

立即学习“Java免费学习笔记（深入）”；

手动创建一个迭代器

下面是一个简单的计数器迭代器示例：

function createCounter(max) {
  let count = 0;
  return {
    next() {
      if (count < max) {
        return { value: count++, done: false };
      } else {
        return { done: true };
      }
    },
    [Symbol.iterator]() {
      return this;
    }
  };
}
<p>const counter = createCounter(3);
for (const n of counter) {
console.log(n); // 输出 0, 1, 2
}</p>

登录后复制

这个例子中，我们手动实现了 next 和 Symbol.iterator，使对象支持 for...of 循环。

生成器（Generator）简化迭代器创建

生成器是 ES6 引入的特殊函数，它可以暂停执行并恢复，极大简化了迭代器的编写。生成器函数用 function* 定义，内部使用 yield 暂停并返回值。

使用JSON进行网络数据交换传输中文WORD版

本文档主要讲述的是使用JSON进行网络数据交换传输；JSON（JavaScript ObjectNotation）是一种轻量级的数据交换格式，易于阅读和编写，同时也易于机器解析和生成，非常适合于服务器与客户端的交互。JSON采用与编程语言无关的文本格式，但是也使用了类C语言的习惯，这些特性使JSON成为理想的数据交换格式。和 XML 一样，JSON 也是基于纯文本的数据格式。由于 JSON 天生是为 JavaScript 准备的，因此，JSON的数据格式非常简单，您可以用 JSON 传输一个简单的 St

查看详情

调用生成器函数不会立即执行，而是返回一个生成器对象——这个对象既是迭代器，也是可迭代对象。

function* numberGen() {
  yield 1;
  yield 2;
  yield 3;
}
<p>const gen = numberGen();
console.log(gen.next()); // { value: 1, done: false }
console.log(gen.next()); // { value: 2, done: false }
console.log(gen.next()); // { value: 3, done: false }
console.log(gen.next()); // { done: true }</p>

登录后复制

每次调用 next()，函数会从上次 yield 的位置继续执行，直到下一个 yield 或函数结束。

生成器的优势与实际用途

生成器不只是写迭代器更方便，还能用于：

惰性求值：只在需要时计算下一个值，适合处理大数据或无限序列
控制异步流程：结合 yield 和 Promise，曾是 async/await 出现前的异步方案
状态机管理：函数可以在多个 yield 之间保持状态

例如，实现一个无限斐波那契序列：

function* fibonacci() {
  let a = 0, b = 1;
  while (true) {
    yield a;
    [a, b] = [b, a + b];
  }
}
<p>const fib = fibonacci();
console.log(fib.next().value); // 0
console.log(fib.next().value); // 1
console.log(fib.next().value); // 1
console.log(fib.next().value); // 2</p>

登录后复制

由于是惰性生成，即使序列无限也不会崩溃。

基本上就这些。迭代器提供统一遍历接口，生成器让创建迭代器变得简单自然。两者配合，构成了现代 JavaScript 中处理序列数据的核心机制。

以上就是JavaScript迭代器与生成器原理的详细内容，更多请关注php中文网其它相关文章！