JavaScript生成器详解与使用教程

怎么入门文章编程？需要学习哪些知识点？这是新手们刚接触编程时常见的问题；下面golang学习网就来给大家整理分享一些知识点，希望能够给初学者一些帮助。本篇文章就来介绍《JavaScript生成器是什么及使用方法》，涉及到，有需要的可以收藏一下

JavaScript生成器是能暂停和恢复执行的特殊函数，通过function声明、yield产出值，调用返回迭代器对象，支持next()推进、for...of遍历及yield委托等高级特性。

JavaScript 生成器（Generator）是一种特殊的函数，能**暂停和恢复执行**，每次调用 next() 方法时返回一个包含 value 和 done 的对象，适合处理异步流程、惰性求值或遍历复杂数据结构。

如何创建生成器函数

在普通函数关键字 function 后加一个星号 *，函数体内使用 yield 暂停执行并产出值：

语法要点：

• 函数声明： function* myGenerator() { ... }
• 函数表达式： const gen = function*() { ... };
• 箭头函数不支持生成器（无 function* 形式）
• yield 只能在生成器函数内部使用，不可出现在普通函数或异步函数中

如何使用生成器（调用与迭代）

调用生成器函数不会立即执行，而是返回一个**生成器对象**（实现了迭代器协议），通过反复调用 next() 推进：

基本用法示例：

function* count() {
  yield 1;
  yield 2;
  yield 3;
}
<p>const it = count(); // 创建迭代器
console.log(it.next()); // { value: 1, done: false }
console.log(it.next()); // { value: 2, done: false }
console.log(it.next()); // { value: 3, done: false }
console.log(it.next()); // { value: undefined, done: true }
</p>

也可用 for...of 自动遍历（忽略 done: true 后的值）：

for (const n of count()) {
  console.log(n); // 依次输出 1, 2, 3
}

生成器的高级能力：传参与委托

next(value) 的参数会作为上一个 yield 表达式的返回值；yield* 可委托另一个可迭代对象（包括其他生成器）：

常见技巧：

• 向生成器传入数据：it.next('hello') → 上一个 yield 处得到 'hello'
• 提前终止：it.return(value) 立即结束并返回 { value, done: true }
• 抛出错误：it.throw(err) 在暂停处触发异常，可用于错误处理
• 组合多个生成器：yield* anotherGenerator() 把控制权交给另一个生成器

典型应用场景

生成器不是日常必需，但在特定场景下非常有力：

• 手动控制异步流程：配合 Promise + 自定义 runner 实现类 async/await 逻辑（现代已较少手写）
• 无限序列生成：如斐波那契、素数流，按需计算不占内存
• 状态机建模：每个 yield 对应一个状态，next() 触发状态迁移
• 替代回调嵌套：将深层回调转为线性代码结构（需配合 Promise 封装）

理论要掌握，实操不能落！以上关于《JavaScript生成器详解与使用教程》的详细介绍，大家都掌握了吧！如果想要继续提升自己的能力，那么就来关注golang学习网公众号吧！