1躺彬、什么是async煤墙、await？
async顧名思義是“異步”的意思宪拥，async用于聲明一個函數是異步的仿野。而await從字面意思上是“等待”的意思，就是用于等待異步完成她君。并且await只能在async函數中使用脚作。
通常async、await都是跟隨Promise一起使用的缔刹。為什么這么說呢球涛？因為async返回的都是一個Promise對象同時async適用于任何類型的函數上。這樣await得到的就是一個Promise對象(如果不是Promise對象的話那async返回的是什么 就是什么)校镐；
await得到Promise對象之后就等待Promise接下來的resolve或者reject亿扁。
我們先看個例子：
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve();
}, time);
})
};
var start = async function () {
// 在這里使用起來就像同步代碼那樣直觀
console.log('start');
await sleep(3000);
console.log('end');
};
start();
上面代碼控制臺運行的結果是：先打印出‘start’，然后等待3秒后打印出“end”,這就是一個簡單的async/await的例子鸟廓。
2从祝、我們需要知道的是：
1、async 表示這是一個async函數肝箱，await只能用在這個函數里面哄褒。
2、async/await 是一種編寫異步代碼的新方法煌张。之前異步代碼的方案是回調和 promise呐赡。
3、async/await 是建立在 promise 的基礎上骏融。
await 后面跟著的應該是一個promise對象（當然链嘀，其他返回值也沒關系，只是會立即執(zhí)行档玻，不過那樣就沒有意義了…）怀泊，
await 表示在這里等待promise返回結果了，再繼續(xù)執(zhí)行误趴。
4霹琼、async/await 像 promise 一樣，也是非阻塞的。
5枣申、async/await 讓異步代碼看起來庞溜、表現起來更像同步代碼温眉。這個是async/await 的真正威力爱榔，也可以說是其相比較promise的最大優(yōu)點路幸。
3、首先了解async函數起什么作用
async function test() {
return "hello world";
}
const result = test();
console.log(result);
瀏覽器打印出來的是：Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: "hello world"}
想一下模孩，如果async函數沒有返回值呢尖阔？會是什么樣？如下代碼：
async function test() {
console.log("111111111")
}
const result = test();
console.log(result);
瀏覽器打印結果如下：
‘111111111’
Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: undefined}
也就是說結果返回的是Promise.resolve(undefined)
看到這里明白了嗎榨咐？async 函數返回的是一個 Promise 對象介却。也就是說如果我們在async函數中 return 一個常量，async 會把這個常量通過 Promise.resolve() 封裝成 Promise 對象祭芦。
既然是 Promise 對象筷笨，那我們也就可以通過then()方法獲取其值，如下
test().then(res => {
console.log(res); // 輸出 hello world
});
看了上面的代碼龟劲，是不是很不明白async/await到底有啥用胃夏？
我們知道Promise 的特點——無等待，所以在沒有 await 的情況下執(zhí)行 async 函數昌跌，它會立即執(zhí)行仰禀，返回一個 Promise 對象，并且蚕愤，絕不會阻塞后面的語句答恶。這和普通返回 Promise 對象的函數并無二致。
那么下一個關鍵點就在于 await 關鍵字了萍诱。
4悬嗓、await 有啥用，做了什么裕坊？
await 操作符一般說來是用于等待一個Promise 對象包竹。它只能在異步函數 async function 中使用。但事實是籍凝，await后可以是一個 Promise 對象或者任何要等待的值周瞎。請參見：await 語法。
如果一個 Promise 被傳遞給一個 await 操作符饵蒂，await 將等待 Promise 正常處理完成并返回其處理結果声诸。
function test(x) {
return new Promise(resolve => {
setTimeout(() => {
resolve(x);
}, 2000);
});
}
async function f1() {
var x = await test(10);
console.log(x); // 10
}
f1();
如果該值不是一個 Promise，await 會把該值轉換為已正常處理的Promise退盯，然后等待其處理結果彼乌。
async function f2() {
var y = await 20;
console.log(y); // 20
}
f2();
如果 Promise 處理異常泻肯，則異常值被拋出。
async function f3() {
try {
var z = await Promise.reject(30);
} catch (e) {
console.log(e); // 30
}
}
f3();
5囤攀、async/await 的優(yōu)勢在于處理 then 鏈
這個是使用async/await最優(yōu)勢的地方
單一的 Promise 鏈并不能發(fā)現 async/await 的優(yōu)勢软免，但是，如果需要處理由多個 Promise 組成的 then 鏈的時候焚挠，優(yōu)勢就能體現出來了（其實，Promise 通過 then 鏈來解決多層回調的問題漓骚，現在又用 async/await 來進一步優(yōu)化它蝌衔，也可以說是async/await基于Promise 做了更好的處理）
假設一個業(yè)務，分多個步驟完成蝌蹂，每個步驟都是異步的噩斟，而且依賴于上一個步驟的結果。我們仍然用 setTimeout 來模擬異步操作：
下邊這幾段代碼是復制網上的案例孤个，能夠說明問題就行剃允。
/**
* 傳入參數 n，表示這個函數執(zhí)行的時間（毫秒）
* 執(zhí)行的結果是 n + 200齐鲤，這個值將用于下一步驟
*/
function takeLongTime(n) {
return new Promise(resolve => {
setTimeout(() => resolve(n + 200), n);
});
}
function step1(n) {
console.log(`step1 with ${n}`);
return takeLongTime(n);
}
function step2(n) {
console.log(`step2 with ${n}`);
return takeLongTime(n);
}
function step3(n) {
console.log(`step3 with ${n}`);
return takeLongTime(n);
}
現在用 Promise 方式來實現這三個步驟的處理
function doIt() {
console.time("doIt");
const time1 = 300;
step1(time1)
.then(time2 => step2(time2))
.then(time3 => step3(time3))
.then(result => {
console.log(`result is ${result}`);
console.timeEnd("doIt");
});
}
doIt();
// c:\var\test>node --harmony_async_await .
// step1 with 300
// step2 with 500
// step3 with 700
// result is 900
// doIt: 1507.251ms
輸出結果 result 是 step3() 的參數 700 + 200 = 900斥废。doIt() 順序執(zhí)行了三個步驟，一共用了 300 + 500 + 700 = 1500 毫秒给郊，和 console.time()/console.timeEnd() 計算的結果一致牡肉。
如果用 async/await 來實現呢，會是這樣
async function doIt() {
console.time("doIt");
const time1 = 300;
const time2 = await step1(time1);
const time3 = await step2(time2);
const result = await step3(time3);
console.log(`result is ${result}`);
console.timeEnd("doIt");
}
doIt();
結果和之前的 Promise 實現是一樣的淆九，但是這個代碼看起來是不是清晰得多统锤，幾乎跟同步代碼一樣。
關于async/await 處理 then 鏈炭庙，網上有很多文章饲窿，可以搜搜，基本可以理解的差不多焕蹄。
