J*aScript生成器函数与迭代器详解_j*ascript技巧_石家庄创泽智能科技有限公司

新闻中心 NEWS CENTER

您当前位置：首页 > 新闻中心 > 网络学院

JaScript生成器函数与迭代器详解_jascript技巧

2025-11-07

浏览次数：次

返回列表

迭代器是遵循next()方法返回value和done的对象，生成器函数通过function*和yield提供惰性求值的可迭代序列，适用于无限序列、大数据分批处理等场景。

javascript生成器函数与迭代器详解_javascript技巧

J*aScript中的生成器函数和迭代器是处理数据序列的重要工具，尤其在需要延迟计算或处理大量数据时非常有用。它们让开发者可以更灵活地控制数据的生成与消费过程。

什么是迭代器（Iterator）

迭代器是一个对象，它定义了一个序列，并可能返回一系列值。迭代器遵循“迭代器协议”：一个对象必须实现 next() 方法，该方法返回一个包含 value 和 done 两个属性的对象。

例如，手动创建一个简单的计数器迭代器：

const counter = {
  current: 0,
  next() {
    this.current += 1;
    return {
      value: this.current,
      done: false
    };
  }
};

调用几次 counter.next() 会依次返回 { value: 1, done: false }、{ value: 2, done: false } 等。虽然可以手动实现，但这种方式不够通用且缺乏结束机制。

生成器函数（Generator Function）简介

生成器函数是一种特殊函数，使用 function* 定义，并通过 yield 关键字暂停执行。调用生成器函数不会立即运行其内部代码，而是返回一个“生成器对象”，这个对象既是迭代器，也是可迭代对象。

示例：生成一个递增数字序列

function* numberGen() {
  let num = 1;
  while (true) {
    yield num++;
  }
}
<p>const gen = numberGen();
gen.next(); // { value: 1, done: false }
gen.next(); // { value: 2, done: false }</p>

每次调用 next()，函数从上次暂停处继续执行，直到遇到下一个 yield。这实现了惰性求值——只在需要时才计算下一个值。

BrandCrowd

一个在线Logo免费设计生成器

200 查看详情 BrandCrowd

生成器的实际应用场景

生成器特别适合以下几种情况：

无限序列：比如斐波那契数列、自然数序列等，可以用生成器按需生成，避免内存溢出。
分批处理大数据：读取大文件或数据库记录时，逐条生成结果，而不是一次性加载全部。
异步流程控制：结合 yield 和 Promise，可用于简化异步操作（尽管现在已被 async/await 取代）。
状态机：利用 yield 暂停不同状态，清晰表达状态流转。

例如，生成斐波那契数列：

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

可迭代协议与 for...of 循环

如果一个对象实现了 [Symbol.iterator]() 方法并返回迭代器，它就是“可迭代的”。生成器函数返回的生成器对象自动具备这一能力。

这意味着你可以直接在 for...of 中使用生成器：

function* colors() {
  yield "red";
  yield "green";
  yield "blue";
}
<p>for (const color of colors()) {
console.log(color); // 依次输出 red, green, blue
}</p>