## 簡介
### 基本概念
Generator函數是ES6提供的一種異步編程解決方案，語法行為與傳統函數完全不同。本章詳細介紹Generator函數的語法和API，它的異步編程應用請看《異步操作》一章。
Generator函數有多種理解角度。從語法上，首先可以把它理解成一個函數的內部狀態的遍歷器（也就是說，Generator函數是一個狀態機）。它每調用一次，就進入下一個內部狀態。Generator函數可以控制內部狀態的變化，依次遍歷這些狀態。
形式上，Generator函數是一個普通函數，但是有兩個特征。一是，function命令與函數名之間有一個星號；二是，函數體內部使用yield語句，定義遍歷器的每個成員，即不同的內部狀態（yield語句在英語里的意思就是“產出”）。
~~~
function* helloWorldGenerator() {
yield 'hello';
yield 'world';
return 'ending';
}
var hw = helloWorldGenerator();
~~~
上面代碼定義了一個Generator函數helloWorldGenerator，它內部有兩個yield語句“hello”和“world”，即該函數有三個狀態：hello，world和return語句（結束執行）。
然后，Generator函數的調用方法與普通函數一樣，也是在函數名后面加上一對圓括號。不同的是，調用Generator函數后，該函數并不執行，返回的也不是函數運行結果，而是一個指向內部狀態的指針對象，也就是上一章介紹的遍歷器對象（Iterator Object）。
下一步，必須調用遍歷器對象的next方法，使得指針移向下一個狀態。也就是說，每次調用next方法，內部指針就從函數頭部或上一次停下來的地方開始執行，直到遇到下一個yield語句（或return語句）為止。換言之，Generator函數是分段執行的，yield命令是暫停執行的標記，而next方法可以恢復執行。
~~~
hw.next()
// { value: 'hello', done: false }
hw.next()
// { value: 'world', done: false }
hw.next()
// { value: 'ending', done: true }
hw.next()
// { value: undefined, done: true }
~~~
上面代碼一共調用了四次next方法。
第一次調用，Generator函數開始執行，直到遇到第一個yield語句為止。next方法返回一個對象，它的value屬性就是當前yield語句的值hello，done屬性的值false，表示遍歷還沒有結束。
第二次調用，Generator函數從上次yield語句停下的地方，一直執行到下一個yield語句。next方法返回的對象的value屬性就是當前yield語句的值world，done屬性的值false，表示遍歷還沒有結束。
第三次調用，Generator函數從上次yield語句停下的地方，一直執行到return語句（如果沒有return語句，就執行到函數結束）。next方法返回的對象的value屬性，就是緊跟在return語句后面的表達式的值（如果沒有return語句，則value屬性的值為undefined），done屬性的值true，表示遍歷已經結束。
第四次調用，此時Generator函數已經運行完畢，next方法返回對象的value屬性為undefined，done屬性為true。以后再調用next方法，返回的都是這個值。
總結一下，調用Generator函數，返回一個部署了Iterator接口的遍歷器對象，用來操作內部指針。以后，每次調用遍歷器對象的next方法，就會返回一個有著value和done兩個屬性的對象。value屬性表示當前的內部狀態的值，是yield語句后面那個表達式的值；done屬性是一個布爾值，表示是否遍歷結束。
### yield語句
由于Generator函數返回的遍歷器，只有調用next方法才會遍歷下一個內部狀態，所以其實提供了一種可以暫停執行的函數。yield語句就是暫停標志。
遍歷器next方法的運行邏輯如下。
（1）遇到yield語句，就暫停執行后面的操作，并將緊跟在yield后面的那個表達式的值，作為返回的對象的value屬性值。
（2）下一次調用next方法時，再繼續往下執行，直到遇到下一個yield語句。
（3）如果沒有再遇到新的yield語句，就一直運行到函數結束，直到return語句為止，并將return語句后面的表達式的值，作為返回的對象的value屬性值。
（4）如果該函數沒有return語句，則返回的對象的value屬性值為undefined。
需要注意的是，yield語句后面的表達式，只有當調用next方法、內部指針指向該語句時才會執行，因此等于為JavaScript提供了手動的“惰性求值”（Lazy Evaluation）的語法功能。
~~~
function* gen{
yield 123 + 456;
}
~~~
上面代碼中，yield后面的表達式`123 + 456`，不會立即求值，只會在next方法將指針移到這一句時，才會求值。
yield語句與return語句既有相似之處，也有區別。相似之處在于，都能返回緊跟在語句后面的那個表達式的值。區別在于每次遇到yield，函數暫停執行，下一次再從該位置繼續向后執行，而return語句不具備位置記憶的功能。一個函數里面，只能執行一次（或者說一個）return語句，但是可以執行多次（或者說多個）yield語句。正常函數只能返回一個值，因為只能執行一次return；Generator函數可以返回一系列的值，因為可以有任意多個yield。從另一個角度看，也可以說Generator生成了一系列的值，這也就是它的名稱的來歷（在英語中，generator這個詞是“生成器”的意思）。
Generator函數可以不用yield語句，這時就變成了一個單純的暫緩執行函數。
~~~
function* f() {
console.log('執行了！')
}
var generator = f();
setTimeout(function () {
generator.next()
}, 2000);
~~~
上面代碼中，函數f如果是普通函數，在為變量generator賦值時就會執行。但是，函數f是一個Generator函數，就變成只有調用next方法時，函數f才會執行。
另外需要注意，yield語句不能用在普通函數中，否則會報錯。
~~~
(function (){
yield 1;
})()
// SyntaxError: Unexpected number
~~~
上面代碼在一個普通函數中使用yield語句，結果產生一個句法錯誤。
下面是另外一個例子。
~~~
var arr = [1, [[2, 3], 4], [5, 6]];
var flat = function* (a){
a.forEach(function(item){
if (typeof item !== 'number'){
yield* flat(item);
} else {
yield item;
}
}
};
for (var f of flat(arr)){
console.log(f);
}
~~~
上面代碼也會產生句法錯誤，因為forEach方法的參數是一個普通函數，但是在里面使用了yield語句。一種修改方法是改用for循環。
~~~
var arr = [1, [[2, 3], 4], [5, 6]];
var flat = function* (a){
var length = a.length;
for(var i =0;i<length;i++){
var item = a[i];
if (typeof item !== 'number'){
yield* flat(item);
} else {
yield item;
}
}
};
for (var f of flat(arr)){
console.log(f);
}
// 1, 2, 3, 4, 5, 6
~~~
### 與Iterator的關系
上一章說過，任意一個對象的Symbol.iterator屬性，等于該對象的遍歷器函數，調用該函數會返回該對象的一個遍歷器。
遍歷器本身也是一個對象，它的Symbol.iterator屬性執行后，返回自身。
~~~
function* gen(){
// some code
}
var g = gen();
g[Symbol.iterator]() === g
// true
~~~
上面代碼中，gen是一個Generator函數，調用它會生成一個遍歷器g。遍歷器g的Symbol.iterator屬性是一個遍歷器函數，執行后返回它自己。
## next方法的參數
yield語句本身沒有返回值，或者說總是返回undefined。next方法可以帶一個參數，該參數就會被當作上一個yield語句的返回值。
~~~
function* f() {
for(var i=0; true; i++) {
var reset = yield i;
if(reset) { i = -1; }
}
}
var g = f();
g.next() // { value: 0, done: false }
g.next() // { value: 1, done: false }
g.next(true) // { value: 0, done: false }
~~~
上面代碼先定義了一個可以無限運行的Generator函數f，如果next方法沒有參數，每次運行到yield語句，變量reset的值總是undefined。當next方法帶一個參數true時，當前的變量reset就被重置為這個參數（即true），因此i會等于-1，下一輪循環就會從-1開始遞增。
這個功能有很重要的語法意義。Generator函數從暫停狀態到恢復運行，它的上下文狀態（context）是不變的。通過next方法的參數，就有辦法在Generator函數開始運行之后，繼續向函數體內部注入值。也就是說，可以在Generator函數運行的不同階段，從外部向內部注入不同的值，從而調整函數行為。
再看一個例子。
~~~
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:false}
~~~
上面代碼中，第二次運行next方法的時候不帶參數，導致y的值等于`2 * undefined`（即NaN），除以3以后還是NaN，因此返回對象的value屬性也等于NaN。第三次運行Next方法的時候不帶參數，所以z等于undefined，返回對象的value屬性等于`5 + NaN + undefined`，即NaN。
如果向next方法提供參數，返回結果就完全不一樣了。
~~~
function* foo(x) {
var y = 2 * (yield (x + 1));
var z = yield (y / 3);
return (x + y + z);
}
var it = foo(5);
it.next()
// { value:6, done:false }
it.next(12)
// { value:8, done:false }
it.next(13)
// { value:42, done:true }
~~~
上面代碼第一次調用next方法時，返回`x+1`的值6；第二次調用next方法，將上一次yield語句的值設為12，因此y等于24，返回`y / 3`的值8；第三次調用next方法，將上一次yield語句的值設為13，因此z等于13，這時x等于5，y等于24，所以return語句的值等于42。
注意，由于next方法的參數表示上一個yield語句的返回值，所以第一次使用next方法時，不能帶有參數。V8引擎直接忽略第一次使用next方法時的參數，只有從第二次使用next方法開始，參數才是有效的。
## for...of循環
for...of循環可以自動遍歷Generator函數，且此時不再需要調用next方法。
~~~
function *foo() {
yield 1;
yield 2;
yield 3;
yield 4;
yield 5;
return 6;
}
for (let v of foo()) {
console.log(v);
}
// 1 2 3 4 5
~~~
上面代碼使用for...of循環，依次顯示5個yield語句的值。這里需要注意，一旦next方法的返回對象的done屬性為true，for...of循環就會中止，且不包含該返回對象，所以上面代碼的return語句返回的6，不包括在for...of循環之中。
下面是一個利用generator函數和for...of循環，實現斐波那契數列的例子。
~~~
function* fibonacci() {
let [prev, curr] = [0, 1];
for (;;) {
[prev, curr] = [curr, prev + curr];
yield curr;
}
}
for (let n of fibonacci()) {
if (n > 1000) break;
console.log(n);
}
~~~
從上面代碼可見，使用for...of語句時不需要使用next方法。
## throw方法
Generator函數還有一個特點，它可以在函數體外拋出錯誤，然后在函數體內捕獲。
~~~
var g = function* () {
while (true) {
try {
yield;
} catch (e) {
if (e != 'a') throw e;
console.log('內部捕獲', e);
}
}
};
var i = g();
i.next();
try {
i.throw('a');
i.throw('b');
} catch (e) {
console.log('外部捕獲', e);
}
// 內部捕獲 a
// 外部捕獲 b
~~~
上面代碼中，遍歷器i連續拋出兩個錯誤。第一個錯誤被Generator函數體內的catch捕獲，然后Generator函數執行完成，于是第二個錯誤被函數體外的catch捕獲。
注意，上面代碼的錯誤，是用遍歷器的throw方法拋出的，而不是用throw命令拋出的。后者只能被函數體外的catch語句捕獲。
~~~
var g = function* () {
while (true) {
try {
yield;
} catch (e) {
if (e != 'a') throw e;
console.log('內部捕獲', e);
}
}
};
var i = g();
i.next();
try {
throw new Error('a');
throw new Error('b');
} catch (e) {
console.log('外部捕獲', e);
}
// 外部捕獲 [Error: a]
~~~
上面代碼之所以只捕獲了a，是因為函數體外的catch語句塊，捕獲了拋出的a錯誤以后，就不會再繼續執行try語句塊了。
如果遍歷器函數內部沒有部署try...catch代碼塊，那么throw方法拋出的錯誤，將被外部try...catch代碼塊捕獲。
~~~
var g = function* () {
while (true) {
yield;
console.log('內部捕獲', e);
}
};
var i = g();
i.next();
try {
i.throw('a');
i.throw('b');
} catch (e) {
console.log('外部捕獲', e);
}
// 外部捕獲 a
~~~
上面代碼中，遍歷器函數g內部，沒有部署try...catch代碼塊，所以拋出的錯誤直接被外部catch代碼塊捕獲。
如果遍歷器函數內部部署了try...catch代碼塊，那么遍歷器的throw方法拋出的錯誤，不影響下一次遍歷，否則遍歷直接終止。
~~~
var gen = function* gen(){
yield console.log('hello');
yield console.log('world');
}
var g = gen();
g.next();
try {
g.throw();
} catch (e) {
g.next();
}
// hello
~~~
上面代碼只輸出hello就結束了，因為第二次調用next方法時，遍歷器狀態已經變成終止了。但是，如果使用throw方法拋出錯誤，不會影響遍歷器狀態。
~~~
var gen = function* gen(){
yield console.log('hello');
yield console.log('world');
}
var g = gen();
g.next();
try {
throw new Error();
} catch (e) {
g.next();
}
// hello
// world
~~~
上面代碼中，throw命令拋出的錯誤不會影響到遍歷器的狀態，所以兩次執行next方法，都取到了正確的操作。
這種函數體內捕獲錯誤的機制，大大方便了對錯誤的處理。如果使用回調函數的寫法，想要捕獲多個錯誤，就不得不為每個函數寫一個錯誤處理語句。
~~~
foo('a', function (a) {
if (a.error) {
throw new Error(a.error);
}
foo('b', function (b) {
if (b.error) {
throw new Error(b.error);
}
foo('c', function (c) {
if (c.error) {
throw new Error(c.error);
}
console.log(a, b, c);
});
});
});
~~~
使用Generator函數可以大大簡化上面的代碼。
~~~
function* g(){
try {
var a = yield foo('a');
var b = yield foo('b');
var c = yield foo('c');
} catch (e) {
console.log(e);
}
console.log(a, b, c);
}
~~~
反過來，Generator函數內拋出的錯誤，也可以被函數體外的catch捕獲。
~~~
function *foo() {
var x = yield 3;
var y = x.toUpperCase();
yield y;
}
var it = foo();
it.next(); // { value:3, done:false }
try {
it.next(42);
} catch (err) {
console.log(err);
}
~~~
上面代碼中，第二個next方法向函數體內傳入一個參數42，數值是沒有toUpperCase方法的，所以會拋出一個TypeError錯誤，被函數體外的catch捕獲。
一旦Generator執行過程中拋出錯誤，就不會再執行下去了。如果此后還調用next方法，將返回一個value屬性等于undefined、done屬性等于true的對象，即JavaScript引擎認為這個Generator已經運行結束了。
~~~
function* g() {
yield 1;
console.log('throwing an exception');
throw new Error('generator broke!');
yield 2;
yield 3;
}
function log(generator) {
var v;
console.log('starting generator');
try {
v = generator.next();
console.log('第一次運行next方法', v);
} catch (err) {
console.log('捕捉錯誤', v);
}
try {
v = generator.next();
console.log('第二次運行next方法', v);
} catch (err) {
console.log('捕捉錯誤', v);
}
try {
v = generator.next();
console.log('第三次運行next方法', v);
} catch (err) {
console.log('捕捉錯誤', v);
}
console.log('caller done');
}
log(g());
// starting generator
// 第一次運行next方法 { value: 1, done: false }
// throwing an exception
// 捕捉錯誤 { value: 1, done: false }
// 第三次運行next方法 { value: undefined, done: true }
// caller done
~~~
上面代碼一共三次運行next方法，第二次運行的時候會拋出錯誤，然后第三次運行的時候，Generator函數就已經結束了，不再執行下去了。
## yield*語句
如果yield命令后面跟的是一個遍歷器，需要在yield命令后面加上星號，表明它返回的是一個遍歷器。這被稱為yield*語句。
~~~
let delegatedIterator = (function* () {
yield 'Hello!';
yield 'Bye!';
}());
let delegatingIterator = (function* () {
yield 'Greetings!';
yield* delegatedIterator;
yield 'Ok, bye.';
}());
for(let value of delegatingIterator) {
console.log(value);
}
// "Greetings!
// "Hello!"
// "Bye!"
// "Ok, bye."
~~~
上面代碼中，delegatingIterator是代理者，delegatedIterator是被代理者。由于`yield* delegatedIterator`語句得到的值，是一個遍歷器，所以要用星號表示。運行結果就是使用一個遍歷器，遍歷了多個Genertor函數，有遞歸的效果。
yield*語句等同于在Generator函數內部，部署一個for...of循環。
~~~
function* concat(iter1, iter2) {
yield* iter1;
yield* iter2;
}
// 等同于
function* concat(iter1, iter2) {
for (var value of iter1) {
yield value;
}
for (var value of iter2) {
yield value;
}
}
~~~
上面代碼說明，yield*不過是for...of的一種簡寫形式，完全可以用后者替代前者。
再來看一個對比的例子。
~~~
function* inner() {
yield 'hello!'
}
function* outer1() {
yield 'open'
yield inner()
yield 'close'
}
var gen = outer1()
gen.next() // -> 'open'
gen.next() // -> a generator
gen.next() // -> 'close'
function* outer2() {
yield 'open'
yield* inner()
yield 'close'
}
var gen = outer2()
gen.next() // -> 'open'
gen.next() // -> 'hello!'
gen.next() // -> 'close'
~~~
上面例子中，outer2使用了`yield*`，outer1沒使用。結果就是，outer1返回一個遍歷器，outer2返回該遍歷器的內部值。
如果`yield*`后面跟著一個數組，由于數組原生支持遍歷器，因此就會遍歷數組成員。
~~~
function* gen(){
yield* ["a", "b", "c"];
}
gen().next() // { value:"a", done:false }
~~~
上面代碼中，yield命令后面如果不加星號，返回的是整個數組，加了星號就表示返回的是數組的遍歷器。
如果被代理的Generator函數有return語句，那么就可以向代理它的Generator函數返回數據。
~~~
function *foo() {
yield 2;
yield 3;
return "foo";
}
function *bar() {
yield 1;
var v = yield *foo();
console.log( "v: " + v );
yield 4;
}
var it = bar();
it.next(); //
it.next(); //
it.next(); //
it.next(); // "v: foo"
it.next(); //
~~~
上面代碼在第四次調用next方法的時候，屏幕上會有輸出，這是因為函數foo的return語句，向函數bar提供了返回值。
`yield*`命令可以很方便地取出嵌套數組的所有成員。
~~~
function* iterTree(tree) {
if (Array.isArray(tree)) {
for(let i=0; i < tree.length; i++) {
yield* iterTree(tree[i]);
}
} else {
yield tree;
}
}
const tree = [ 'a', ['b', 'c'], ['d', 'e'] ];
for(let x of iterTree(tree)) {
console.log(x);
}
// a
// b
// c
// d
// e
~~~
下面是一個稍微復雜的例子，使用yield*語句遍歷完全二叉樹。
~~~
// 下面是二叉樹的構造函數，
// 三個參數分別是左樹、當前節點和右樹
function Tree(left, label, right) {
this.left = left;
this.label = label;
this.right = right;
}
// 下面是中序（inorder）遍歷函數。
// 由于返回的是一個遍歷器，所以要用generator函數。
// 函數體內采用遞歸算法，所以左樹和右樹要用yield*遍歷
function* inorder(t) {
if (t) {
yield* inorder(t.left);
yield t.label;
yield* inorder(t.right);
}
}
// 下面生成二叉樹
function make(array) {
// 判斷是否為葉節點
if (array.length == 1) return new Tree(null, array[0], null);
return new Tree(make(array[0]), array[1], make(array[2]));
}
let tree = make([[['a'], 'b', ['c']], 'd', [['e'], 'f', ['g']]]);
// 遍歷二叉樹
var result = [];
for (let node of inorder(tree)) {
result.push(node);
}
result
// ['a', 'b', 'c', 'd', 'e', 'f', 'g']
~~~
## 作為對象屬性的Generator函數
如果一個對象的屬性是Generator函數，可以簡寫成下面的形式。
~~~
let obj = {
* myGeneratorMethod() {
···
}
};
~~~
上面代碼中，myGeneratorMethod屬性前面有一個星號，表示這個屬性是一個Generator函數。
它的完整形式如下，與上面的寫法是等價的。
~~~
let obj = {
myGeneratorMethod: function* () {
// ···
}
};
~~~
## Generator函數推導
ES7在數組推導的基礎上，提出了Generator函數推導（Generator comprehension）。
~~~
let generator = function* () {
for (let i = 0; i < 6; i++) {
yield i;
}
}
let squared = ( for (n of generator()) n * n );
// 等同于
// let squared = Array.from(generator()).map(n => n * n);
console.log(...squared);
// 0 1 4 9 16 25
~~~
“推導”這種語法結構，不僅可以用于數組，ES7將其推廣到了Generator函數。for...of循環會自動調用遍歷器的next方法，將返回值的value屬性作為數組的一個成員。
Generator函數推導是對數組結構的一種模擬，它的最大優點是惰性求值，即直到真正用到時才會求值，這樣可以保證效率。請看下面的例子。
~~~
let bigArray = new Array(100000);
for (let i = 0; i < 100000; i++) {
bigArray[i] = i;
}
let first = bigArray.map(n => n * n)[0];
console.log(first);
~~~
上面例子遍歷一個大數組，但是在真正遍歷之前，這個數組已經生成了，占用了系統資源。如果改用Generator函數推導，就能避免這一點。下面代碼只在用到時，才會生成一個大數組。
~~~
let bigGenerator = function* () {
for (let i = 0; i < 100000; i++) {
yield i;
}
}
let squared = ( for (n of bigGenerator()) n * n );
console.log(squared.next());
~~~
## 含義
### Generator與狀態機
Generator是實現狀態機的最佳結構。比如，下面的clock函數就是一個狀態機。
~~~
var ticking = true;
var clock = function() {
if (ticking)
console.log('Tick!');
else
console.log('Tock!');
ticking = !ticking;
}
~~~
上面代碼的clock函數一共有兩種狀態（Tick和Tock），每運行一次，就改變一次狀態。這個函數如果用Generator實現，就是下面這樣。
~~~
var clock = function*(_) {
while (true) {
yield _;
console.log('Tick!');
yield _;
console.log('Tock!');
}
};
~~~
上面的Generator實現與ES5實現對比，可以看到少了用來保存狀態的外部變量ticking，這樣就更簡潔，更安全（狀態不會被非法篡改）、更符合函數式編程的思想，在寫法上也更優雅。Generator之所以可以不用外部變量保存狀態，是因為它本身就包含了一個狀態信息，即目前是否處于暫停態。
### Generator與協程
協程（coroutine）是一種程序運行的方式，可以理解成“協作的線程”或“協作的函數”。協程既可以用單線程實現，也可以用多線程實現。前者是一種特殊的子例程，后者是一種特殊的線程。
**（1）協程與子例程的差異**
傳統的“子例程”（subroutine）采用堆棧式“后進先出”的執行方式，只有當調用的子函數完全執行完畢，才會結束執行父函數。協程與其不同，多個線程（單線程情況下，即多個函數）可以并行執行，但是只有一個線程（或函數）處于正在運行的狀態，其他線程（或函數）都處于暫停態（suspended），線程（或函數）之間可以交換執行權。也就是說，一個線程（或函數）執行到一半，可以暫停執行，將執行權交給另一個線程（或函數），等到稍后收回執行權的時候，再恢復執行。這種可以并行執行、交換執行權的線程（或函數），就稱為協程。
從實現上看，在內存中，子例程只使用一個棧（stack），而協程是同時存在多個棧，但只有一個棧是在運行狀態，也就是說，協程是以多占用內存為代價，實現多任務的并行。
**（2）協程與普通線程的差異**
不難看出，協程適合用于多任務運行的環境。在這個意義上，它與普通的線程很相似，都有自己的執行上下文、可以分享全局變量。它們的不同之處在于，同一時間可以有多個線程處于運行狀態，但是運行的協程只能有一個，其他協程都處于暫停狀態。此外，普通的線程是搶先式的，到底哪個線程優先得到資源，必須由運行環境決定，但是協程是合作式的，執行權由協程自己分配。
由于ECMAScript是單線程語言，只能保持一個調用棧。引入協程以后，每個任務可以保持自己的調用棧。這樣做的最大好處，就是拋出錯誤的時候，可以找到原始的調用棧。不至于像異步操作的回調函數那樣，一旦出錯，原始的調用棧早就結束。
Generator函數是ECMAScript 6對協程的實現，但屬于不完全實現。Generator函數被稱為“半協程”（semi-coroutine），意思是只有Generator函數的調用者，才能將程序的執行權還給Generator函數。如果是完全執行的協程，任何函數都可以讓暫停的協程繼續執行。
如果將Generator函數當作協程，完全可以將多個需要互相協作的任務寫成Generator函數，它們之間使用yield語句交換控制權。
## 應用
Generator可以暫停函數執行，返回任意表達式的值。這種特點使得Generator有多種應用場景。
### （1）異步操作的同步化表達
Generator函數的暫停執行的效果，意味著可以把異步操作寫在yield語句里面，等到調用next方法時再往后執行。這實際上等同于不需要寫回調函數了，因為異步操作的后續操作可以放在yield語句下面，反正要等到調用next方法時再執行。所以，Generator函數的一個重要實際意義就是用來處理異步操作，改寫回調函數。
~~~
function* loadUI() {
showLoadingScreen();
yield loadUIDataAsynchronously();
hideLoadingScreen();
}
var loader = loadUI();
// 加載UI
loader.next()
// 卸載UI
loader.next()
~~~
上面代碼表示，第一次調用loadUI函數時，該函數不會執行，僅返回一個遍歷器。下一次對該遍歷器調用next方法，則會顯示Loading界面，并且異步加載數據。等到數據加載完成，再一次使用next方法，則會隱藏Loading界面。可以看到，這種寫法的好處是所有Loading界面的邏輯，都被封裝在一個函數，按部就班非常清晰。
Ajax是典型的異步操作，通過Generator函數部署Ajax操作，可以用同步的方式表達。
~~~
function* main() {
var result = yield request("http://some.url");
var resp = JSON.parse(result);
console.log(resp.value);
}
function request(url) {
makeAjaxCall(url, function(response){
it.next(response);
});
}
var it = main();
it.next();
~~~
上面代碼的main函數，就是通過Ajax操作獲取數據。可以看到，除了多了一個yield，它幾乎與同步操作的寫法完全一樣。注意，makeAjaxCall函數中的next方法，必須加上response參數，因為yield語句構成的表達式，本身是沒有值的，總是等于undefined。
下面是另一個例子，通過Generator函數逐行讀取文本文件。
~~~
function* numbers() {
let file = new FileReader("numbers.txt");
try {
while(!file.eof) {
yield parseInt(file.readLine(), 10);
}
} finally {
file.close();
}
}
~~~
上面代碼打開文本文件，使用yield語句可以手動逐行讀取文件。
### （2）控制流管理
如果有一個多步操作非常耗時，采用回調函數，可能會寫成下面這樣。
~~~
step1(function (value1) {
step2(value1, function(value2) {
step3(value2, function(value3) {
step4(value3, function(value4) {
// Do something with value4
});
});
});
});
~~~
采用Promise改寫上面的代碼。
~~~
Q.fcall(step1)
.then(step2)
.then(step3)
.then(step4)
.then(function (value4) {
// Do something with value4
}, function (error) {
// Handle any error from step1 through step4
})
.done();
~~~
上面代碼已經把回調函數，改成了直線執行的形式，但是加入了大量Promise的語法。Generator函數可以進一步改善代碼運行流程。
~~~
function* longRunningTask() {
try {
var value1 = yield step1();
var value2 = yield step2(value1);
var value3 = yield step3(value2);
var value4 = yield step4(value3);
// Do something with value4
} catch (e) {
// Handle any error from step1 through step4
}
}
~~~
然后，使用一個函數，按次序自動執行所有步驟。
~~~
scheduler(longRunningTask());
function scheduler(task) {
setTimeout(function() {
var taskObj = task.next(task.value);
// 如果Generator函數未結束，就繼續調用
if (!taskObj.done) {
task.value = taskObj.value
scheduler(task);
}
}, 0);
}
~~~
注意，yield語句是同步運行，不是異步運行（否則就失去了取代回調函數的設計目的了）。實際操作中，一般讓yield語句返回Promise對象。
~~~
var Q = require('q');
function delay(milliseconds) {
var deferred = Q.defer();
setTimeout(deferred.resolve, milliseconds);
return deferred.promise;
}
function* f(){
yield delay(100);
};
~~~
上面代碼使用Promise的函數庫Q，yield語句返回的就是一個Promise對象。
多個任務按順序一個接一個執行時，yield語句可以按順序排列。多個任務需要并列執行時（比如只有A任務和B任務都執行完，才能執行C任務），可以采用數組的寫法。
~~~
function* parallelDownloads() {
let [text1,text2] = yield [
taskA(),
taskB()
];
console.log(text1, text2);
}
~~~
上面代碼中，yield語句的參數是一個數組，成員就是兩個任務taskA和taskB，只有等這兩個任務都完成了，才會接著執行下面的語句。
### （3）部署iterator接口
利用Generator函數，可以在任意對象上部署iterator接口。
~~~
function* iterEntries(obj) {
let keys = Object.keys(obj);
for (let i=0; i < keys.length; i++) {
let key = keys[i];
yield [key, obj[key]];
}
}
let myObj = { foo: 3, bar: 7 };
for (let [key, value] of iterEntries(myObj)) {
console.log(key, value);
}
// foo 3
// bar 7
~~~
上述代碼中，myObj是一個普通對象，通過iterEntries函數，就有了iterator接口。也就是說，可以在任意對象上部署next方法。
下面是一個對數組部署Iterator接口的例子，盡管數組原生具有這個接口。
~~~
function* makeSimpleGenerator(array){
var nextIndex = 0;
while(nextIndex < array.length){
yield array[nextIndex++];
}
}
var gen = makeSimpleGenerator(['yo', 'ya']);
gen.next().value // 'yo'
gen.next().value // 'ya'
gen.next().done // true
~~~
### （4）作為數據結構
Generator可以看作是數據結構，更確切地說，可以看作是一個數組結構，因為Generator函數可以返回一系列的值，這意味著它可以對任意表達式，提供類似數組的接口。
~~~
function *doStuff() {
yield fs.readFile.bind(null, 'hello.txt');
yield fs.readFile.bind(null, 'world.txt');
yield fs.readFile.bind(null, 'and-such.txt');
}
~~~
上面代碼就是依次返回三個函數，但是由于使用了Generator函數，導致可以像處理數組那樣，處理這三個返回的函數。
~~~
for (task of doStuff()) {
// task是一個函數，可以像回調函數那樣使用它
}
~~~
實際上，如果用ES5表達，完全可以用數組模擬Generator的這種用法。
~~~
function doStuff() {
return [
fs.readFile.bind(null, 'hello.txt'),
fs.readFile.bind(null, 'world.txt'),
fs.readFile.bind(null, 'and-such.txt')
];
}
~~~
上面的函數，可以用一模一樣的for...of循環處理！兩相一比較，就不難看出Generator使得數據或者操作，具備了類似數組的接口。
