ES2017 標準引入了 async 函數，使得異步操作變得更加方便。

　　async 函數是什么?一句話，它就是 Generator 函數的語法糖。研究 async 的原理，就必須先弄清楚 Generator 是個啥。

　　Generator 函數是 ES6 提供的一種異步編程解決方案，語法行為與傳統函數完全不同。

　　形式上，Generator 函數是一個普通函數，但是有兩個特征。一是，function關鍵字與函數名之間有一個星號;二是，函數體內部使用yield表達式，定義不同的內部狀態(yield在英語里的意思就是“產出”)

　　看一個例子：

　　function* gen(x) { var y = yield x + 2; return y;}var g = gen(1);g.next() // { value: 3, done: false }g.next() // { value: undefined, done: true }

　　上面代碼中，調用 Generator 函數，會返回一個內部指針(即遍歷器)g。這是 Generator 函數不同于普通函數的另一個地方，即執行它不會返回結果，返回的是指針對象。調用指針g的next方法，會移動內部指針(即執行異步任務的第一段)，指向第一個遇到的yield語句，上例是執行到x + 2為止。

　　換言之，next方法的作用是分階段執行Generator函數。每次調用next方法，會返回一個對象，表示當前階段的信息(value屬性和done屬性)。value屬性是yield語句后面表達式的值，表示當前階段的值;done屬性是一個布爾值，表示 Generator 函數是否執行完畢，即是否還有下一個階段。

　　這樣手工的執行next()函數，著實有些麻煩，能寫個工具讓他自動執行嗎?那我們就來試試：

　　封裝一個 spawn 函數，返回一個 spawn 函數，給函數傳入 Generator函數作為參數，spawn 實現 next() 方法的執行。

　　function fn(args) { return spawn(function* () { // ... });}

　　spawn 函數的實現：

　　function spawn(genF) { return new Promise(function(resolve, reject) { const gen = genF(); function step(nextF) { let next; try { next = nextF(); } catch(e) { return reject(e); } if(next.done) { return resolve(next.value); } Promise.resolve(next.value).then(function(v) { step(function() { return gen.next(v); }); }, function(e) { step(function() { return gen.throw(e); }); }); } step(function() { return gen.next(undefined); }); });}

　　應用這個方法執行一下第一個例子：

　　function fn(x) { return spawn(function* gen() { var y = yield x + 2 return y; });}fn(1).then((result) => { console.log(result) // 3})

　　如果 yield 后面是個 Promise, 就可以實現異步了：

　　function fn(x) { return spawn(function* gen() { var y = yield new Promise((resolve) => { setTimeout(() => { resolve(x + 1) }, 1000) }) return y; });}fn(1).then((result) => { console.log(result) // 過一秒后打印 3})

　　這樣，過一秒后就打印 3 了。

　　從整個代碼上來看，實現起來有些麻煩。Async 簡化了一切，使用它，不再需要 spawn 函數，只需將 Generator 函數的星號(*)替換成async，將yield替換成await，僅此而已。改造一下：

　　async function fn(x) { let result = await new Promise((resolve) => { setTimeout(() => { resolve(x + 2) }, 1000) }) return result}fn(1).then((result) => { console.log(result)})

　　真是簡潔了很多。

　　最后看一個面試題，如何將程序的執行結果 1，3，2，改造為 1，2, 3

　　只需修改一個 onGetUser 函數即可：

　　async onGetUser() { // getUser().then((result) => { // console.log(result) // }) let result = await getUser() console.log(result)}