關於宏任務、微任務和事件循環

我想不少人都見過或聽過這種題。promise

setTimeout(() => { console.log('settimeout') });

new Promise((resolve) => {
    resolve('');
    console.log('promise-resolve');
}).then(() => {
    console.log('promise-then');
});

console.log('script');

當你把上述的代碼塊放到瀏覽器中執行的時候會發現輸出順序是:瀏覽器

promise-resolve
script
promise-then
settimeout

爲何會是這樣的輸出順序呢?這就要提到事件循環、宏任務和微任務的概念了。衆所周知,JavaScript是一個單線程的語言,單線程意味着代碼會自上而下依次執行,若是有一個耗時的操做,那麼頁面就會卡死,基於此,便有了異步的概念,而宏任務微任務都是屬於異步任務。而JavaScript一次性不能處理多個任務,因此便須要一個能有效執行各個任務的邏輯,這即是事件循環異步

每次循環都會先執行宏任務,而後查找是否有可執行的微任務,有的話就執行微任務,不然執行下一個宏任務,以此循環。線程

宏任務:Script代碼塊,setTimeout,setInterval,I/O操做,setImmediate。
微任務:Promise,process.nextTick,MutationObservercode

相關文章
相關標籤/搜索