JS生成器函数_Yield暂停机制解析-js教程-PHP中文网

JS生成器函数_Yield暂停机制解析

夜晨

发布： 2025-11-15 23:33:06

原创

441人浏览过

生成器函数通过 yield 实现暂停与恢复，调用 next() 时执行到 yield 并返回值，状态被保留；再次调用 next() 从上次暂停处继续，支持惰性求值、异步控制和状态机管理。

js生成器函数_yield暂停机制解析

生成器函数是 JavaScript 中一种特殊的函数类型，它能够控制函数的执行流程，在运行过程中暂停和恢复。这种能力主要依赖于 yield 关键字。理解 yield 的暂停机制，有助于更好地掌握异步编程、迭代器封装等高级用法。

生成器函数通过 function* 定义，调用后返回一个可迭代的生成器对象，而不是立即执行函数体。

function* myGenerator() {
  yield '第一段';
  yield '第二段';
  return '结束';
}

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

yield 表达式的本质是“产出值并暂停执行”。当生成器遇到 yield 时，函数状态被保留（包括上下文变量、执行位置），然后暂停，等待下一次 next() 被调用。

例如：

function* counter() {
  let count = 0;
  while (true) {
    yield ++count;
  }
}

const c = counter();
console.log(c.next().value); // 1
console.log(c.next().value); // 2

变量 count 的状态在两次调用之间被保留，说明生成器维护了内部执行上下文。

壁纸样机神器

免费壁纸样机生成

next() 方法可以接收参数，这个参数会成为上一个 yield 表达式的返回值。这是双向通信的关键。

function* echo() {
  const input = yield '等待输入...';
  console.log('收到：', input);
  yield '处理完成';
}

const e = echo();
console.log(e.next()); // { value: '等待输入...', done: false }
console.log(e.next('你好')); // 收到：你好
// { value: '处理完成', done: false }

第一次 next() 执行到 yield '等待输入...'，暂停并返回。第二次 next('你好') 将 '你好' 赋给了 yield 表达式的左侧，即 input 变量。

生成器的暂停机制特别适用于以下场景：

虽然现代 JS 更多使用 async/await 处理异步，但生成器仍是理解协程、迭代器协议的重要基础。

基本上就这些。yield 的暂停不是阻塞，而是交出执行权，等到外部主动恢复。这种协作式控制流让 JS 的函数行为更加灵活。

以上就是JS生成器函数_Yield暂停机制解析的详细内容，更多请关注php中文网其它相关文章！

大家都在看：