async/await 裏的並行和串行

咱們在使用 async/await 語法時，有時會這樣用：

function getName () {
    return new Promise((resolve, reject)=>{
        setTimeout(()=>{
            resolve('tony')
        }, 2000)
    })
}
function getId () {
    return new Promise((resolve, reject)=>{
        setTimeout(()=>{
            resolve('123')
        }, 3000)
    })
}

;(async ()=>{
    let name = await getName()
    let id = await getId()
    alert(`name:${name}, id:${id}`)
})()

一眼看上去，應該是3秒種多一點就會 alert 出 'name:tony, id:123'，實際上卻花費了5秒纔出現提示框，她們是串行執行的！而咱們想要的是並行執行，由於她們之間並無依賴關係。串行執行只會白白增長無謂的等待時間！怎麼解決呢？

咱們先看 Promise 的語法：

new Promise( function(resolve, reject) {...} /* executor */ );
executor是帶有 resolve 和 reject 兩個參數的函數 。 Promise構造函數執行時當即 調用executor 函數 ， resolve 和 reject 兩個函數做爲參數傳遞給executor（executor 函數在Promise構造函數返回新建對象前被調用）。resolve 和 reject 函數被調用時，分別將promise的狀態改成fulfilled（完成）或rejected（失敗）。executor 內部一般會執行一些異步操做，一旦完成，能夠調用resolve函數來將promise狀態改爲fulfilled，或者在發生錯誤時將它的狀態改成rejected。

傳給 Promise 做爲參數的函數會在 new 建立實例時當即調用

上面的代碼，能夠分解成這樣：

;(async ()=>{
    let namePromise = getName()
    let name = await namePromise
    let idPromise = getId()              //  2000ms以後才生成 Promise 實例
    let id = await idPromise
    alert(`name:${name}, id:${id}`)
})()

因此，若是想並行執行，咱們應該先生成全部須要使用的Promise實例：

;(async ()=>{
    let namePromise = getName()
    let idPromise = getId()              // 先生成全部 promise 實例
    let name = await namePromise
    let id = await idPromise
    alert(`name:${name}, id:${id}`)
})()

或者使用Promise.all

;(async ()=>{
    var result = await Promise.all([getName(), getId()])
    alert(`name:${result[0]}, id:${result[2]}`)
})()