Generator函数next传入参数执行结果：为什么是以下结果？

Question

Generator函数next传入参数执行结果：为什么是以下结果？

function* foo(x) {
  var y = 2 * (yield (x + 1));
  var z = yield (y / 3);
  return (x + y + z);
}

var a = foo(5);
a.next() // Object{value:6, done:false}
a.next() // Object{value:NaN, done:false}
a.next() // Object{value:NaN, done:true}

var b = foo(5);
b.next() // { value:6, done:false }
b.next(12) // { value:8, done:false }//?
b.next(13) // { value:42, done:true }//?

Answer 1

首先还是要详读一下generator的文档：https://developer.mozilla.org...
其次来逐步分析：调用next表示将执行权交回生成器函数内部，如果有参数将其作为yield表达式的值，生成器函数内部的逻辑继续。b.next()将x+1的值返回，得到6这个没问题。b.next(12)表示yield(x+1)将以12继续往下执行，处理到y/3返回得到了24/3=8。以此类推，b.next(13)就得到5+24+13=42

Answer 2

使用值调用next,第一次调用没有记录任何内容，因为生成器最初没有产生任何结果。

function* foo(x) {
  var y = 2 * (yield (x + 1));//b.next(12)传入值12， (yield (x + 1))整个产生值是12并赋值给y; 返回的Iterator对象时{ value:6, done:false } 
  var z = yield (y / 3);//b.next(13)传入值13, yield (y / 3)整个产生值是13并赋值给z; 返回的Iterator对象是{ value:8, done:false } value值是yield表达式后面产生的结果
  return (x + y + z);//x=5 y=24 z=13 
}

var a = foo(5);
a.next() // Object{value:6, done:false}
a.next() // Object{value:NaN, done:false}
a.next() // Object{value:NaN, done:true}

var b = foo(5);
b.next() // 第一次调用next,yield没有任何产生值，返回{ value:6, done:false } 
b.next(12) // { value:8, done:false } 
b.next(13) // { value:42, done:true }

当生成器函数恢复执行时，因为上次执行到yield (x + 1)语句的右半段，并没有执行*2的操作，所以并没有赋值给y，其他yield赋值语句操作类似。可以参考这篇文章：https://juejin.cn/post/706931...