基礎知識
async: 關鍵字用于標記一個函數為異步函數,該函數中有一個或多個promise對象,需要等待執行完成后才會繼續執行。
await:關鍵字,用于等待一個promise對象執行完,并返回其中的值,只能在async函數內部使用。可以將異步操作轉化成同步代碼。
在看一道引發血案的面試題的時候,將其整體的流程梳理了下流程,順序并將代碼的執行邏輯也整理了出來。執行結果如下:
在執行完成之后,自己在末尾加上了setInterval方法,及時調換了兩者的順序,也會發現,先執行setTimeout,然后再執行setInterval方法。整理后的代碼如下:
console.log("script start 1")async1()
async function async1(){console.log("async1 start 2 第二步")//等async執行完畢之后,繼續按照asyn2下方的代碼執行await async2()console.log("async1 end 6 步驟6" )
}
//待執行到promise完成之后,await 收到對應的執行返回狀態,繼續往下執行 步驟6
new Promise(function(resolve){console.log("promise1 4")//執行成功 resolve,//await 接收到Promise返回的函數,會接著往下執行第6步;// resolve 代表成功的狀態,在async1 函數執行完之后,接著執行接著執行then下面的函數;如果沒有該段代碼,則不執行 步驟7resolve()
}).then(function(){console.log("promise2 7")
})async function async2(){//執行完async2,但是沒有Promise對象返回,會繼續記性往下執行console.log("async2 3")
}console.log("script end 5")
//在setTimeout執行完成之后,繼續執行定時器 setInterval方法
setInterval(()=>{console.log("set interval")
})
//在函數都執行完成之后,接著執行異步操作 延時 setTimeout
setTimeout(()=>{console.log('settimeout')
})
綜上所得,async 先執行,接著執行promise,await執行返回之后,在繼續執行then中內部的函數,再順序接著執行setTimeout和setInterval。