JavaScript生成器函数是什么？yield怎么用？

对于一个文章开发者来说，牢固扎实的基础是十分重要的，golang学习网就来带大家一点点的掌握基础知识点。今天本篇文章带大家了解《JavaScript生成器函数是什么？yield关键字如何工作？》，主要介绍了，希望对大家的知识积累有所帮助，快点收藏起来吧，否则需要时就找不到了！

Generator函数是可暂停执行的状态机，调用返回生成器对象，需用next()启动并逐次推进；yield暂停并保留上下文，支持外部传值，return/throw会终止迭代。

Generator 函数本质是暂停执行的函数

JavaScript 中的 function* 声明的函数不是普通函数，它返回一个 Generator 对象，这个对象是可迭代的、可控制的执行状态机。调用它不会立即执行函数体，而是返回一个未启动的生成器实例；只有第一次调用 next() 才开始执行，直到遇到第一个 yield 表达式暂停。

yield 是单向暂停点，不是 return

yield 暂停函数执行，并把右侧表达式的值作为 { value: ..., done: false } 中的 value 返回。此时函数上下文（作用域、变量、执行位置）被完整保留，后续再次调用 next() 会从暂停处继续，而非重新开始。

关键区别：

• return 终止整个函数，之后再调用 next() 总是返回 { value: undefined, done: true }
• yield 可出现多次，每次对应一次 next() 调用
• yield 表达式本身有返回值：下一次 next(arg) 传入的 arg 会成为当前 yield 表达式的计算结果（即“外部注入值”）

function* counter() {
  let i = 0;
  while (true) {
    const step = yield i; // 暂停，返回 i；下一次 next(x) 的 x 成为 step
    i += (step || 1);
  }
}
<p>const gen = counter();
gen.next();     // { value: 0, done: false }
gen.next(5);    // { value: 5, done: false } → step === 5，i 变成 5
gen.next();     // { value: 6, done: false } → step === undefined，i 变成 6</p>

常见陷阱：忘记调用 next() 或误用 for...of

Generator 不会自动执行，不调用 next() 就永远卡在初始状态。另外：for...of 隐式调用 next()，但会忽略 return 和抛出的异常，且无法传参给 yield —— 所以需要手动控制时别用 for...of。

容易出错的情况：

• 直接打印 generator 实例，看到 Generator {} 就以为出错了（其实正常）
• 在 yield 后面写异步操作（如 await），却没加 async function*（ES2018+ 才支持）
• 用 Array.from(gen) 消费生成器后，再调用 gen.next() 总是得到 { value: undefined, done: true }（因为已遍历完毕）

next()、throw()、return() 的行为差异

三个方法都恢复生成器执行，但触发路径不同：

• next(value)：恢复执行，value 成为上一个 yield 表达式的值；若无上一个 yield（即刚启动），value 被丢弃
• throw(error)：在暂停位置抛出错误，可被内部 try...catch 捕获；若未捕获，则生成器结束，后续 next() 返回 done: true
• return(value)：立即结束生成器，返回 { value, done: true }；跳过后续所有 yield

注意：return() 和 throw() 都会终止迭代器，之后所有 next() 调用均返回 { value: undefined, done: true }。

真正难的是理解「执行权移交」——yield 不是语法糖，它是 JS 运行时级的协作式调度原语。一旦你习惯用 next() 显式推进，而不是依赖自动循环，很多状态机、异步流程、惰性序列问题就自然解开了。

以上就是本文的全部内容了，是否有顺利帮助你解决问题？若是能给你带来学习上的帮助，请大家多多支持golang学习网！更多关于文章的相关知识，也可关注golang学习网公众号。