本文實例講述了ES6中Generator與異步操作。分享給大家供大家參考，具體如下：
Generator與異步操作
1.Generator概念
可以把Generator理解成一個狀態機（好像React中有很多state），封裝了多個內部狀態。執行Generator返回的是一個遍歷器對象，可以遍歷Generator產生的每一個狀態。在function后加*就可以聲明一個Generator函數。
function* hiGenerator(){yield 'hi';yield 'ES5';return '!';}var hi = hiGenerator();console.log(hi); //hiGenerator {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window}console.log(hi.next()); //Object {value: "hi", done: false}console.log(hi.next()); //Object {value: "ES5", done: false}console.log(hi.next()); //Object {value: "!", done: true}2.yield語句
由于Generator函數返回的遍歷器對象，只有調用next()方法才會遍歷到下一個狀態，所以其實提供了一種可以暫停的執行函數。每次執行next()，遇到yield語句就暫停執行，且將yield后的表達式的值作為返回的對象的value值；如果沒有遇到yield，則返回return語句作為返回對象的value值；如果沒有return，則返回對象的value值為undefined。
3.next方法
next()方法可以帶一個參數，該參數會被當做上一條yield語句的返回值。
function* add(c, d){var a = 0;a = yield a + c;a = yield a + d;return}var sum = add(1, 2);console.log(sum); //add {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window}console.log(sum.next()); //Object {value: 1, done: false}console.log(sum.next()); //Object {value: NaN, done: false}console.log(sum.next()); //Object {value: undefined, done: true}如果不給next()傳參，會使得下一步計算無法進行。
function* add(c, d){var a = 0;a = yield a + c;a = yield a + d + 1;return}var sum = add(1, 2);console.log(sum); //add {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window}console.log(sum.next()); //Object {value: 1, done: false}console.log(sum.next(1)); //Object {value: 4, done: false}console.log(sum.next(3)); //Object {value: undefined, done: true}4.用for..of...遍歷Generator
用for..of...遍歷Generator時候，不需要顯示調用next()方法。
5.一個Generator函數產生的遍歷器對象g調用return方法后，返回對象的value屬性為return方法的參數。
6.在一個Generator函數內部調用另一個Generator函數。需要使用yield*。
希望本文所述對大家ECMAscript程序設計有所幫助。
新聞熱點
疑難解答
