js宏任务和微任务的理解

233 阅读1分钟

通俗来讲,都是一个函数或者方法。

宏任务除了主代码块,其他类型的都是由浏览器渲染进程中除了js引擎和渲染线程的其他异步处理线程,放置于宏任务异步队列中,像定时器,网络请求,事件。

微任务是由js引擎,放置于微任务异步队列中,像process.nexttick, promise中的then和catch等。

当js引擎执行完主代码块,需要调度宏任务之前,会把微任务队列清空后再调用并执行宏任务。

可以参考以下代码:

输出结果如下

const { resolve } = require("path")console.log(1)setTimeout(()=>{  new Promise((resolve)=>{    console.log(2)    resolve(3)  }).then(resolve=>{      console.log(resolve)  })}, 1000)new Promise((resolve)=>{    console.log(4)    resolve(5)}).then(resolve=>{    console.log(resolve)    setTimeout(()=>{        new Promise((resolve)=>{            console.log(6)            resolve(7)        }).then(resolve=>{            console.log(resolve)        })    }, 1000)})setTimeout(()=>{    new Promise((resolve)=>{      console.log(8)      resolve(9)    }).then(resolve=>{        console.log(resolve)    })  }, 1000)new Promise((resolve)=>{    console.log(10)    resolve(11)}).then(resolve=>{    console.log(resolve)    setTimeout(()=>{        new Promise((resolve)=>{            console.log(12)            resolve(13)        }).then(resolve=>{            console.log(resolve)        })    }, 1000)})console.log(14)

1
4
10
14
5
11
2
3
8
9
6
7
12
13