前端必知必会,你不知道的前端

JavaScript 之 宏任务,微任务

2019-06-12  本文已影响108人  赵永盛

浏览器是多进程的,js 是由单线程执行的,下面内容需要事件循环的知识,关注我,每天更新技术干货

注意: setTimeout 有延迟,最少是 4ms

宏任务队列有多个,之间有优先级,优先级高的优先执行,一次事件循环执行一个任务。所以是一次事件循环中选择其中一个优先级高的队列的一个宏任务执行
微任务队列只有一个,一次事件循环中全部执行完毕

执行一个宏任务,然后执行该宏任务期间添加的所有微任务,然后执行一次 UI 渲染。然后再执行一个宏任务,以此往复。


宏任务多个队列对应的数据源:

接下来看几个例子:


输出结果:


首先输出
main1
Promise 中的函数也是属于同步代码,后面 then 中的才输出异步代码,所以继续输出
promise
然后输出
main2
setTimeout 属于下一个宏任务,所以先执行所有该期间微任务。
注意 process.nextTick 优先级比 promise 高,所以先输出
process.nextTick1
然后输出
promise then
然后执行下一个宏任务和其期间添加的微任务,即输出
setTimeout
process.nextTick2

再看一个示例:


输出:



和你预测的一样吗?

上一篇 下一篇

猜你喜欢

热点阅读