JS生成器next方法全解析

JavaScript 中的生成器（Generator）是一种能暂停与恢复执行的特殊函数，其核心在于 next() 方法——它不仅启动或推进生成器运行、返回包含 value 和 done 的结果对象，还支持向 yield 表达式传入参数以实现双向通信；配合 return() 和 throw() 可灵活终止或注入错误，更可通过手动调度与 Promise 协作，模拟 async/await 的异步流程控制逻辑。深入理解 next() 的行为，是掌握生成器机制、解锁高级异步编程模式与现代 JS 运行原理的关键入口。

在 JavaScript 中，生成器（Generator）是一种特殊函数，能够暂停执行并返回中间结果。它通过 *function 定义，并使用 yield 暂停。调用生成器函数后会返回一个生成器对象，该对象具有 next() 方法，用于控制函数的执行流程。

next() 的基本用法

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

next() 返回一个对象，包含两个属性：

• value：当前 yield 表达式的值或 return 的值
• done：布尔值，表示生成器是否已执行完毕

function* simpleGen() {
  yield '第一项';
  yield '第二项';
  return '结束';
}

const gen = simpleGen();
console.log(gen.next()); // { value: '第一项', done: false }
console.log(gen.next()); // { value: '第二项', done: false }
console.log(gen.next()); // { value: '结束', done: true }

向 next() 传参

next() 可以接收参数，这个参数会作为上一个 yield 表达式的返回值。

注意：第一次调用 next() 时传参无效（因为没有前一个 yield），通常第一次调用不传参。

function* genWithInput() {
  const input1 = yield '等待输入1';
  const input2 = yield 收到：${input1};
  return 最终：${input2};
}

const g = genWithInput();
console.log(g.next()); // { value: '等待输入1', done: false }
console.log(g.next('A')); // { value: '收到：A', done: false }
console.log(g.next('B')); // { value: '最终：B', done: true }

next() 与异步流程控制

生成器常用于简化异步操作，配合 Promise 使用，实现类似 async/await 的效果。

虽然现代开发更多使用 async/await，但理解这种模式有助于深入掌握 JS 异步机制。

function* asyncGen() {
  const user = yield fetch('/user');
  const posts = yield fetch(/posts?uid=${user.id});
  return posts;
}

上面代码中，next() 配合外部执行器可逐步解析每个异步请求。

异常处理与提前终止

除了 next()，生成器还支持 throw() 和 return() 方法。

调用 return() 会强制让生成器进入完成状态，后续 next() 均返回 { value: undefined, done: true }。

throw() 可向生成器注入错误，可在函数内用 try/catch 捕获。

基本上就这些。next() 是驱动生成器运行的核心方法，掌握其行为对理解生成器机制至关重要。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《JS生成器next方法全解析》文章吧，也可关注golang学习网公众号了解相关技术文章。