ES6 Generator函式

基本介紹

• Generator 函式是一個狀態機，封裝了多個內部狀態。

• 執行 Generator 函式會返回一個遍歷器物件，可以依次遍歷 Generator 函式內部的每一個狀態。

• function關鍵字與函式名之間有一個星號，函式體內部使用yield表示式，定義不同的內部狀態。

function* helloWorldGenerator() {    yield 'hello';    yield 'world';    return 'ending';
}var hw = helloWorldGenerator();console.log(hw.next())          // { value: 'hello', done: false }console.log(hw.next())          // { value: 'world', done: false }console.log(hw.next())          // { value: 'ending', done: true }console.log(hw.next())          // { value: undefined, done: true }// value屬性表示當前的內部狀態的值，是yield表示式後面那個表示式的值；done屬性是一個布林值，表示是否遍歷結束。

yield 表示式

• yield表示式只能用在 Generator 函式里面，用在其他地方都會報錯。

• yield表示式如果用在另一個表示式之中，必須放在圓括號裡面。

• 如果yield表示式後面跟的是一個遍歷器物件，需要在yield表示式後面加上星號，表明它返回的是一個遍歷器物件。這被稱為yield*表示式。

function* foo() {    yield 'a';    yield 'b';
}function* bar() {    yield 'x';    yield* foo();    yield 'y';
}for (let v of bar()) {    console.log(v);
}// x a b y

遍歷器物件的方法

• next()
  yield表示式本身沒有返回值，或者說總是返回undefined。next方法可以帶一個引數，該引數就會被當作上一個yield表示式的返回值。
  由於next方法的參數列示上一個yield表示式的返回值，所以在第一次使用next方法時，傳遞引數是無效的。

function* foo(x) {    var y = 2 * (yield(x + 1));    var z = yield(y / 3);    return (x + y + z);
}var a = foo(5);console.log(a.next())    //{ value: 6, done: false }console.log(a.next())    //{ value: NaN, done: false }console.log(a.next())    //{ value: NaN, done: true }var b = foo(5);console.log(b.next())    //{ value: 6, done: false }console.log(b.next(3))   // { value: 2, done: false }console.log(b.next(5))   // { value: 16, done: true }   x=5  y=6  z=5

• throw()
  Generator 函式返回的遍歷器物件，都有一個throw方法，可以在函式體外丟擲錯誤，然後在 Generator 函式體內捕獲。
  throw方法可以接受一個引數，該引數會被catch語句接收，建議丟擲Error物件的例項。
  throw方法被捕獲以後，會附帶執行下一條yield表示式。也就是說，會附帶執行一次next方法。
  一旦 Generator 執行過程中丟擲錯誤，且沒有被內部捕獲，就不會再執行下去了。

function* g() {    try {        yield;
    } catch (e) {        console.log('內部捕獲', e);
    }    yield console.log('b');
};var i = g();
i.next();
i.throw(new Error('出錯了！'));   //內部捕獲 Error: 出錯了！ b

• return()
  可以返回給定的值，並且終結遍歷 Generator 函式。
  如果 Generator 函式內部有try...finally程式碼塊，那麼return方法會推遲到finally程式碼塊執行完再執行。

function* gen() {    yield 1;    yield 2;    yield 3;
}var g = gen();console.log(g.next())   //  { value: 1, done: false }console.log(g.return('foo'))    //{ value: 'foo', done: true }console.log(g.next())   //{ value: undefined, done: true }

• Generator 函式的this
  Generator 函式返回的總是遍歷器物件，而不是this物件。
  Generator 函式也不能跟new命令一起用，會報錯。

function* g() {    this.a = 11;
}let obj = g();console.log(obj.a)    //undefined

作者：tiancai啊呆
連結：