Generator

简介

Generator 函数是 ES6 提供的一种异步编程解决方案，语法行为与传统函数完全不同。
Generator 函数有多种理解角度。语法上，首先可以把它理解成，Generator 函数是一个状态机，封装了多个内部状态。
执行 Generator 函数会返回一个遍历器对象，也就是说，Generator 函数除了状态机，还是一个遍历器对象生成函数。返回的遍历器对象，可以依次遍历 Generator 函数内部的每一个状态。
形式上，Generator 函数是一个普通函数，但是有两个特征。一是，function关键字与函数名之间有一个星号；二是，函数体内部使用yield表达式，定义不同的内部状态（yield在英语里的意思就是“产出”）。

方法

1. Generator.prototype.next()
   yield表达式本身没有返回值，或者说总是返回undefined。next方法可以带一个参数，该参数就会被当作上一个yield表达式的返回值。
2. Generator.prototype.return()
   方法返回给定的值并结束生成器。
3. Generator.prototype.throw()
   方法用来向生成器抛出异常，并恢复生成器的执行，返回带有 done 及 value 两个属性的对象。

yield表达式

yield表达式与return语句既有相似之处，也有区别。相似之处在于，都能返回紧跟在语句后面的那个表达式的值。区别在于每次遇到yield，函数暂停执行，下一次再从该位置继续向后执行，而return语句不具备位置记忆的功能。一个函数里面，只能执行一次（或者说一个）return语句，但是可以执行多次（或者说多个）yield表达式。正常函数只能返回一个值，因为只能执行一次return；Generator 函数可以返回一系列的值，因为可以有任意多个yield。从另一个角度看，也可以说 Generator 生成了一系列的值，这也就是它的名称的来历（英语中，generator 这个词是“生成器”的意思）。

语法注意点：
1.yield表达式只能用在 Generator 函数里面
2.yield表达式如果用在另一个表达式之中，必须放在圆括号里面
3.yield表达式用作函数参数或放在赋值表达式的右边，可以不加括号。
例如

function* demo() {
  foo(yield 'a', yield 'b'); // OK
  let input = yield; // OK
}

例子

1. 最基础的Generator代码

function* Hello() {
    yield 100
    yield (function () {return 200})()
    return 300
}

var h = Hello()
console.log(typeof h)  // object

console.log(h.next())  // { value: 100, done: false }
console.log(h.next())  // { value: 200, done: false }
console.log(h.next())  // { value: 300, done: true }
console.log(h.next())  // { value: undefined, done: true }

2. 下面看看如何使用 Generator 函数，执行一个真实的异步任务。

function* gen() {
    var url = 'https://api.github.com/users/github';
    var result = yield fetch(url);
    console.log("result", result);
}

var g = gen();
var result = g.next();

result.value.then(function (data) {
    return data.json();
}).then(function (data) {
    g.next(data);
});