考虑以下场景:

var a = 1;
var b = 2;function foo(){a++;b = b * a;a = b + 3;
}function bar(){b--;a  = 8 + b;b = a * 2;
}foo();
bar();
console.log(a, b);   // 11 22bar();
foo();
console.log(a, b);    // 183 180

对于上面的两个函数foo和bar,它们中的任何一个,一旦开始了就会一直执行下去直至完毕.
倘若,我们想在foo中a++后,暂停一下在去执行bar中的某个语句… 可以使用ES6提供的yield语句.
改变如下:

var a = 1;
var b = 2;function *foo(){    // *是生成器的标志a++;yield;b = b * a;a = (yield b) +3;
}function *bar(){b--;yield;a = (yield 8) + b;b = a * (yield 2);
}// 调用:foo执行完,在执行bar()
var s1 = foo();   // 初始化迭代器.
s1.next();  
console.log(a, b);  // 2 2 
s1.next();
console.log(a, b);  // 2 4// 还有最后一个 a = (yield b) + 3;
s1.next();   // "预计"执行后会得到 7 4 
console.log(a, b);  // 实际上  NaN  4// 诶????
// 实际执行yield b时,并得不到b的值因此会返回NaN. 于是a就是NaN// 改进如下(foo中有2个yield, 因此会有3个next)
var s1 = foo();
var val1 = s1.next().value;
console.log(a, b);
val1 = s1.next(val1).value;
console.log(a, b);
val1 = s1.next(val1).value;
console.log(a, b);// 运行bar,(bar中有3个yield,会有4个next调用)
var s2 = bar();  
var val2 = s2.next().value;
console.log(a, b);
val2 = s2.next(val2).value;
console.log(a, b);
val2 = s2.next(val2).value;
console.log(a, b);
val2 = s2.next(val2).value;
console.log(a, b);

可以看到,和正常函数执行结果是一样的…
还注意到.上述好多赋值语句是重复的,因此可以考虑构造一个辅助函数step,用于将yield返回的值原样的传入.

// step
function step(gen){var it = gen();var last;return function(){last = it.next(last).value;}
}

接下来使用step,先执行bar,后执行foo

var s1 = step(bar);
var s2 = step(foo);s1();  //  1   1 
s1();  //  1   1
s1();  //  9   1
s1();  //  9   18
s2();  //  10  18
s2();  //  10  180
s2();  //  183 180

回归主题,交替执行bar和foo

var s1 = step(foo);
var s2 = step(bar);s2();  // b--  ,yield
s2();  // yield 8
s1();  // a++, yield
s2();  // a = 8 + b, yield 2
s1();  // b= b * a,  yield b
s1();  // a = b + 3
s2();  // b = a * 2

可以看到,bar 和foo 都经过了多次的停止与启动,且它们之间进行了交替操作.
参考《你不知道的JavaScript》(中卷)P241~P242