js yield 实现

Yield 实现原理

在 JavaScript 中，yield 是生成器函数（Generator Function）的关键字，用于暂停和恢复函数执行。生成器函数通过 function* 语法定义，调用时返回一个生成器对象（Generator Object），该对象遵循迭代器协议。

基本用法示例

function* simpleGenerator() {
  yield 1;
  yield 2;
  return 3;
}

const gen = simpleGenerator();
console.log(gen.next()); // { value: 1, done: false }
console.log(gen.next()); // { value: 2, done: false }
console.log(gen.next()); // { value: 3, done: true }

实现机制

生成器函数通过 yield 暂停执行，保存当前上下文（包括局部变量、指令指针等）。每次调用 next() 方法时，生成器从上次暂停的位置恢复执行，直到遇到下一个 yield 或 return。

手动模拟生成器

可以通过闭包和状态管理模拟 yield 的行为：

function mockGenerator() {
  let state = 0;
  return {
    next: function() {
      switch (state) {
        case 0:
          state++;
          return { value: 1, done: false };
        case 1:
          state++;
          return { value: 2, done: false };
        default:
          return { value: undefined, done: true };
      }
    }
  };
}

const mockGen = mockGenerator();
console.log(mockGen.next()); // { value: 1, done: false }
console.log(mockGen.next()); // { value: 2, done: false }
console.log(mockGen.next()); // { value: undefined, done: true }

异步生成器

yield 可与异步操作结合，实现类似 async/await 的流程控制：

function* asyncGenerator() {
  const result = yield new Promise(resolve => setTimeout(() => resolve('Done'), 1000));
  console.log(result);
}

function runGenerator(gen) {
  const iterator = gen();
  function handle(iterResult) {
    if (iterResult.done) return;
    if (iterResult.value instanceof Promise) {
      iterResult.value.then(res => handle(iterator.next(res)));
    }
  }
  handle(iterator.next());
}

runGenerator(asyncGenerator); // 输出 "Done"（1秒后）

注意事项

• 生成器对象不可重用，完成迭代后再次调用 next() 始终返回 { done: true }。
• yield* 可用于委托给另一个生成器或可迭代对象。
• 生成器函数可通过 throw() 方法在暂停位置抛出异常。