js裡的微任務和巨集任務

2022-05-07 03:18:10 字數 1062 閱讀 8740

當js解析執行時,會被引擎分為兩類任務,同步任務(synchronous)非同步任務(asynchronous)

對於同步任務來說,會被推到執行棧按順序去執行這些任務。

對於非同步任務來說,當其可以被執行時,會被放到乙個任務佇列(task queue)裡等待js引擎去執行。

當執行棧中的所有同步任務完成後,js引擎才會去任務佇列裡檢視是否有任務存在,並將任務放到執行棧中去執行,執行完了又會去任務佇列裡檢視是否有已經可以執行的任務。這種迴圈檢查的機制,就叫做事件迴圈(event loop)

對於任務佇列,其實是有更細的分類。其被分為微任務(microtask)佇列&巨集任務(macrotask)佇列

巨集任務: settimeout、setinterval等,會被放在巨集任務(macrotask)佇列。

微任務: promise的then、mutation observer等,會被放在微任務(microtask)佇列。

event loop(js的迴圈機制)的執行順序是:

首先執行執行棧裡的任務。

執行棧清空後,檢查微任務(microtask)佇列,將可執行的微任務全部執行。

取巨集任務(macrotask)佇列中的第一項執行。

回到第二步。

注意: 微任務佇列每次全執行,巨集任務佇列每次只取一項執行。

settimeout(() =>);

promise.resolve().then(() =>);

}, 0);

settimeout(() =>, 0);

promise.resolve().then(() =>);

console.log('執行同步任務');

最後的執行結果是:

//執行同步任務

//我是第乙個微任務

//我是第乙個巨集任務

//我是第乙個巨集任務裡的第乙個微任務

//我是第乙個巨集任務裡的第二個微任務

//我是第二個巨集任務

JS微任務和巨集任務

1.巨集任務 包括整體 script,settimeout,setinterval i o ui 互動事件 setimmediate node.js 環境 2.微任務 promise mutaionobserver process.nexttick node.js 環境 promise.resolv...

js的巨集任務和微任務

script 主程式 settimeout setinterval setimmediate i o操作 ui渲染 requestanimationframe promise 原生 mutationobserver process.nexttick mutation object.observe 事...

巨集任務和微任務

概念 1.巨集任務 當前呼叫棧中執行的 成為巨集任務。主 快,定時器等等 3.巨集任務中的事件放在callback queue中,由事件觸發執行緒維護 微任務的事件放在微任務佇列中,由js引擎執行緒維護。執行機制02 1.在執行棧中執行乙個巨集任務。2.執行過程中遇到微任務,將微任務新增到微任務佇列...