17370845950

JavaScript迭代器和生成器并非专为简化异步流程设计，但生成器配合co库或手动驱动曾是async/await前管理异步的重要方式；迭代器通过next()方法返回{value, done}对象，提供统一遍历接口。

JavaScript迭代器和生成器不是用来“简化异步流程”的核心工具，但它们为处理异步操作提供了更清晰、可组合的结构基础——尤其是生成器配合 co 库或手动驱动时，曾是 async/await 出现前管理异步流程的重要方式。

迭代器：让对象变得“可遍历”

迭代器是一个具有 next() 方法的对象，每次调用返回形如 { value, done } 的结果。它不关心数据来源（数组、Map、自定义逻辑），只提供统一的消费接口。

例如，手动实现一个计数迭代器：

function createCounter(max) {
  let i = 0;
  return {
    next() {
      if (i < max) {
        return { value: i++, done: false };
      } else {
        return { value: undefined, done: true };
      }
    }
  };
}
const it = createCounter(3);
console.log(it.next()); // { value: 0, done: false }
console.log(it.next()); // { value: 1, done: false }
console.log(it.next()); // { value: 2, done: false }
console.log(it.next()); // { value: undefined, done: true }

只要对象有 [Symbol.iterator]() 方法并返回迭代器，就能被 for...of、扩展运算符等原生语法识别。

生成器：暂停执行的函数，天生是迭代器工厂

生成器函数用 function* 声明，内部用 yield 暂停并产出值。每次调用 next()，函数从上次暂停处继续，直到下一个 yield 或结束。

它自动返回一个迭代器对象，无需手动实现 next 和状态管理：

function* idGenerator() {
  let id = 1;
  while (true) {
    yield id++;
  }
}
const gen = idGenerator();
console.log(gen.next().value); // 1
console.log(gen.next().value); // 2
console.log(gen.next().value); // 3

生成器的关键价值在于：控制权可交还给调用方，便于在每一步插入逻辑（比如等待异步结果）。

生成器如何配合异步操作（历史视角）

在 async/await 推出前，开发者常用生成器 + 协程库（如 co）模拟同步写法处理异步：

• 生成器内用 yield 等待 Promise，co 自动调用 next 并传递 resolve 值
• 代码看起来像同步，实际是 Promise 驱动的异步流程
• 例如：yield fetch('/api/user') → co 等待 Promise 完成后把响应传给下一步

这种模式本质是“将异步操作扁平化”，避免回调嵌套，但需要额外库支持。如今 async/await 已内置该能力，更简洁、调试更友好，生成器已较少用于此场景。

现代建议：用对工具，不强行替代

• 需要自定义遍历逻辑（如树的深度优先、分页请求流）？用迭代器或生成器
• 想写可中断、可恢复的数据处理流程（如按需加载日志、无限滚动）？生成器很适合
• 单纯处理异步请求链？优先用 async/await —— 语言级支持，无依赖，语义明确
• 已有生成器逻辑且维护成本可控？不必重写；新项目中除非有特殊控制流需求，否则不推荐为异步而用生成器

迭代器和生成器的价值在于表达“惰性计算”与“控制移交”，而非替代 Promise 或 async/await。理解它们，是为了写出更灵活、更可组合的数据抽象，而不是让异步变简单——那部分，JS 已经帮你做好了。