Event Loop js中的巨集任務和微任務

2022-09-09 08:12:15 字數 1625 閱讀 9532

個人理解,有錯誤望指出:

event loop:事件迴圈,是指瀏覽器一種解決js單執行緒執行時不會阻塞的機制.

先說一下執行順序:

js**從上往下執行,遇到巨集任務,放到巨集任務佇列;遇到微任務,放到微任務佇列;**從上到下執行完畢,檢測微任務佇列中是否有微任務存在,存在就執行,執行完清空微任務佇列,去執行巨集任務,如果巨集任務執行過程中有微任務,把微任務放到微任務佇列,         繼續繼續巨集任務,巨集任務執行完畢,再去檢測微任務佇列,往返迴圈

巨集任務:settimeout、setinterval、i/o、ui rendering、requestanimationframe

微任務:promise.then catch finally、mutationobserver、process.nexttick(node獨有)
例1:

console.log('script start');  主線程執行

settimeout(function() , 0);

promise.resolve().then(function() ).then(function() );

console.log('script end'); 主線程執行

// script start、script end、promise1、promise2、settimeout

例2

//主線程直接執行

console.log('1');

//丟到巨集事件佇列中

settimeout(function() )

new promise(function(resolve) ).then(function() )

})//微事件1

process.nexttick(function() )

//主線程直接執行

new promise(function(resolve) ).then(function() )

//丟到巨集事件佇列中

settimeout(function() )

new promise(function(resolve) ).then(function() )

}) // 1、7、6、8、2、4、3、5、9、11、10、12

例3

//主線程直接執行

console.log('1');

//丟到巨集事件佇列中

settimeout(function() ).then(function() )

})async function fn1()

//主線程直接執行

async function fn2()

fn1()

//主線程直接執行

new promise(function(resolve) ).then(function() )

//丟到巨集事件佇列中

settimeout(function() ).then(function() )

}) // 1、b、7、a、8、2、4、5、9、11、12

瀏覽器中的 Event Loop,巨集任務與微任務

當我們執行 js 的時候其實就是往執行棧中放入函式,那麼遇到非同步 的時候該怎麼辦?其實當遇到非同步的 時,會被掛起並在需要執行的時候加入到 task 有多種 task 佇列中。一旦執行棧為空,event loop 就會從 task 佇列中拿出需要執行的 並放入執行棧中執行,所以本質上來說 js 中...

ABAP 中的巨集

report zcp saptest2 data result type i,int1 type i value 1,int2 type i value 2.define operation.result 1 2 3.output 1 2 3 result.end of definition.def...

swift中的巨集

swift本身不支援巨集定義,因此相關的操作採用的是常量代替 1.建立乙個swift檔案專門用於存放代替巨集的常量 2.常量 巨集定義 let screen height uiscreen.mainscreen bounds height let screen width uiscreen.main...