JavaScript生成器，如何理解yield*？function*+yield*

我们相信：世界是美好的，你是我也是。平行空间的世界里面，不同版本的生活也在继续...

本文说说Javascript生成器中的特殊用法：yield*【重点是星号】。function*生成器内部逻辑使用了yield*，这究竟是什么样的生成器用法呢？yield*连接两个生成器，合二为一。

苏南大叔的“程序如此灵动”博客，记录苏南大叔的代码编程经验总结。本文测试环境：nodejs@20.18.0，chrome@131.0.6778.205。本文讲述yield*的用法，官方的说法是“委托”。可以委托给其它生成器，也可以委托给其它可迭代对象。

测试代码

function* s() {
  yield "su";
  yield "nan";
}

function* n() {
  yield* s();                     // 特殊用法一
  yield* ["苏", "南"];            // 特殊用法二
  yield* new Set(["da", "shu"]);  // 特殊用法三
  yield "大叔";                   // 普通用法
}

const sn = n();
console.log(sn.next()); // { value: "su", done: false }
console.log(sn.next()); // { value: "nan", done: false }
console.log(sn.next()); // { value: "苏", done: false }
console.log(sn.next()); // { value: "南", done: false }
console.log(sn.next()); // { value: "da", done: false }
console.log(sn.next()); // { value: "shu", done: false }
console.log(sn.next()); // { value: "大叔", done: false }
console.log(sn.next()); // { value: undefined, done: true }

代码讲解

从运行结果上来看，

• yield* f()，就像个引用的关系，把相关的代码引入到对应位置了。
• yield* []，就是把数组里面的元素，一个一个都yield出去。
• yield* new Set([])，就是把Set()里面的元素，一个一个都yield出去。

相关文章

• https://newsn.net/say/js-yield.html
• https://newsn.net/say/js-yield-2.html

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。