ES6 生成器学习

完整的运行案例

我们总是假设: 一个函数一旦开始执行,就会运行到结束,期间不会有其他代码能够打断它并插入值.（eval(…)不考虑,而且也不推荐）

var x = 1;

function foo() {
  x++;
  bar();
  console.log(x);
}

function bar(){
  x++;
}

foo(); // 3

// 如果foo函数长这样,但是我们还想x的运行结果是三,该怎么办?
function foo() {
  x++;
  console.log(x);
}

生成器示例

有没有可能在函数foo()在运行过程中,在某一步进行中断,转而运行其他代码呢?
而ES6的生成器就是通过某种形式在代码内部指示暂停,实现中断从而运行其他代码。

var x = 1;

// 代码function *foo(){..}和function* foo(){..}是等价的,因为这样使用*foo()来引用生成器比较一致。如果只用foo()形式你就不清楚我指的是生成器还是常规函数
function *foo() {
  x++;
  yield; 
  console.log(x);
}

function bar() {
  x++;
}

var it = foo(); // 构造一个迭代器,控制生成器的运行
it.next();  // 启动生成器*foo(),运行到第一个 yield,并在yield语句处暂停
bar();
it.next();  // 从第一次暂停的yield处恢复生成器*foo()的运行,运行到第二个 yield(如果有)

// 生成器是一类特殊的函数可以多次启动/暂停