理解 ES6 语法中 yield* 关键字的作用

在 ES6 中新增了生成器函数的语法，本文解释了与生成器函数有关的 yield* 关键字，及其使用场景。

描述

根据语法规范，yield* 的作用是代理 yield 表达式，将需要函数本身产生（yield）的值委托出去。yield* 后面跟一个生成器函数、或其他可迭代的对象（如一个数组、字符串、arguments对象）。
yield* 表达式的返回值，就是其后面可迭代对象迭代完毕时的返回值。

举例

第 1 步，构造一个生成器函数。

function* numbers () {
     yield 1;
     yield 2;
   
     return 'numbers';
 }

第 2 步，在上述生成器函数外层做一个代理。

function* delegate () {
     var str = yield* numbers();
     console.log(str);
     
     yield 3;

     return 'delegate';
}

第 3 步，构造迭代器。

var iterator = delegate();

第 4 步，输出迭代结果。

 /**
  * 第一次输出结果
  * { value: 1, done: false }
  */
 console.log(iterator.next()) // 第一次输出
 
 /**
  * 第二次输出结果
  * { value: 2, done: false }
  */
 console.log(iterator.next()) // 第二次输出
 
 /**
  * 第三次输出结果
  * numbers
  * { value: 3, done: false }
  */
 console.log(iterator.next()) // 第三次输出
 
 /**
  * 第四次输出结果
  * { value: 'delegate', done: true }
  */
 console.log(iterator.next()) // 第四次输出

输出结果描述

1. 第三次输出时，输出两行内容。第一行内容为 delegate 函数中 console.log(str) 输出的，值为 numbers 函数的返回值。
2. 第四次输出时，输出一行内容，其中的 value 值为 delegate 函数的返回值。此时，done 属性为 true。

扩展阅读

• yield*关键字