超级厉害的JavaScript —— ECMAScript 6 标准（7） —— Generator 函数

形式

Generator函数是一个普通函数，形式上有两个特征：
- function关键字与函数名之间有一个*；
- 函数体内部使用yield语句。

function* generator(){
    yield 'hellow';
    return 'world';
}

var g = generator();

---

执行

Generator函数的执行需要使用next()调用，每次调用next()都会直到遇到yield处停止，并产出value；

function* generator(){
    console.log(1);
    yield 'y1';
    console.log(2);
    yield 'y2';
    return 'r';
}

var g = generator();
console.log(typeof g);
console.log(g.next());
console.log(g.next());
console.log(g.next());
console.log(g.next());

/*
object
1
{value : 'y1',done : false}
2
{value : 'y2',done : false}
{value : 'r',done : true}
{value : undefined,done : true}
*/

调用Generator函数，会返回一个遍历器对象，代表Generator函数的内部指针，以后，每次调用遍历器的next()，就会返回一个有着value和done两个属性的对象，value代表当前的内部状态的值，是由yield语句产出的，等于其后面那个表达式的值；done属性是一个布尔值，表示是否遍历完成。

可以看到，这里是先输出object再输出1的，这意味着执行generator函数并不会立即执行函数，只是返回了一个遍历器对象，直到执行next()才会执行函数。

在函数内部除了’yield’会产出value，return也会产出value。但是yield具备位置记忆功能，函数暂停执行，下一次再从该位置继续向后执行，而return只会返回一次，再次执行next()函数并不会再次执行，得到的value也是undefined。

---

next方法的参数

yield本身没有返回值，或者说是返回undefined。next方法可以带一个参数，该参数就会被当作最近一次使函数暂停的yield的返回值，然后再执行之后的函数语句。

function* f(){
    console.log(yield "a");     //3
    console.log(yield "b");     //5
}

var g = f();
console.log(g.next());          //1
console.log("space");           //2，f中在第一个yield产出后就暂停执行了 
console.log(g.next("c"));       //4，"c"传递给的是f中的第一个yield作为返回值 
console.log(g.next());          //6
/*
{value : "a" , done : false}
space
c
{value : "b" , done : false}
undefined
{value : undefined , done : true}
*/

可以看到yield在产出后Generator函数就停止执行了，直到遇到下一个 next()，就会将next的参数传递给yield作为返回值，然会继续执行Generator函数的后续代码。

---

Generator.prototype.throw()

Generator函数返回的遍历器对象，都有一个throw方法，可以向Generator函数抛出错误，然后再Generator函数内捕获：

function* f(){
    console.log("start");
    try{
        yield "first";
        yield "second";
    }catch(e){
        console.log("in"+e);
    }
}

var g = f();
console.log(g.next().value);
try{
    g.throw("error");
    g.throw("error");
}catch(e){
    console.log("out"+e);
}
/*
start
first
inerror
outerror
*/

这里遍历器对象g连续抛出了两个错误，第一个错误抛向了Generator函数体内的第一个yield，并被Generator函数体内的catch捕获；而第二个错误因为Generator函数已经执行到catch语句后了，跳过了第二个yield，没有yield可以接住这个错误，所以会冒泡到上层函数，被上层函数catch语句捕获。所以说throw方法也会想next一样激活函数。

---

Generator.prototype.return()

Generator函数返回的遍历器对象，还有一个return方法，return方法会终结遍历Generator函数，并且可以返回value等于参数的对象。

function* generator(){
    yield 1;
    try{
        yield 2;
        yield 3;
    }finally{
        yield 4;
        yield 5;
    }
    yield 6;
}

var g = generator();
g.next();       //{value : 1 , done : false}
g.next();       //{value : 2 , done : false}
g.return(7);    //{value : 4 , done : false}
g.next();       //{value : 5 , done : false}
g.next();       //{value : 7 , done : true}
g.next();       //{value : undefined , done : true}

值得注意的是，yield正在try...finally代码块中的时候执行return，那么return会推迟到finally代码块执行完再执行。

---

yield*

在GeneratorOuter 函数内部可以使用yield* GeneratorInner语法将GeneratorInner函数的遍历器代理到GeneratorOuter 的遍历器中：

function* inner(){
    yield "inner";
}

function* outer1(){
    yield "open";
    yield inner();
    yield "close";
}

function* outer2(){
    yield "open";
    yield* inner();
    yield "close";
}

var gen1 = outer1();
console.log(gen1.next().value);
console.log(gen1.next().value);
console.log(gen1.next().value);
/*
open
GeneratorFunctionPrototype { _invoke: [Function: invoke] }
close
*/

var gen2 = outer2();
console.log(gen2.next().value);
console.log(gen2.next().value);
console.log(gen2.next().value);
/*
open
inner
close
*/

可以看到，使用了yield*使用后，next()会遍历inner内部的yield；而不使用yield*的，其实返回的是inner的遍历器对象。

如果被代理的Generator函数有return语句，那么就可以向代理它的Generator函数返回数据。

function* foo(){
    yield 1;
    return 2;
} 

function *bar() {
  yield 3;
  var v = yield *foo();
  console.log( "v: " + v );
  yield 4;
}

var it = bar();
console.log(it.next().value);
console.log(it.next().value);
console.log(it.next().value);
console.log(it.next().value);
/*
3
1
v : 2
4
undefined
*/

第三个next()时，foo会返回2，并赋值给v，遇到yield 4产出4，暂停bar的执行。

任何数据结构只要有Iterator接口，就可以被yield*遍历。

function* gen(){
  yield* ["a", "b", "c"];
}
gen().next() // { value:"a", done:false }


let read = (function* () {
  yield 'hello';
  yield* 'hello';
})();
read.next().value // "hello"
read.next().value // "h"

read遍历器中，yield 'hellow'因为不是yield*操作，所以是返回了整个字符串。

---

作为对象属性的Generator函数

作为对象属性的Generator函数有两种形式：

let obj = {
  * myGeneratorFirst() {
    //···
  },
  myGeneratorSecond: function* () {
    // ···
  }
};

---

Generator函数的this

Generator函数返回的总是遍历器实例（iterator），而遍历器实例的原型是Generator函数的原型，所以iterator.__proto__ === Generator.prototype，意味着iterator会继承Generator函数的prototype对象上的方法。

function* g() {}

g.prototype.hello = function () {
  return 'hi!';
};

let obj = g();

obj.__proto__ === g.prototype;  //true
obj instanceof g;               // true
obj.hello();                    // 'hi!'

但是，记住Generator函数返回的是遍历器对象，不是this，并且Generator函数只能调用，不能跟new一起用：

function* g() {
  this.a = 11;
}

let obj = g();
obj.a // undefined，返回的不是this，而是一个遍历器

new g();//TypeError: F is not a constructor