成都网站建设设计

将想法与焦点和您一起共享

JavaScript中macrotask和microtask的区别是怎样的

这篇文章将为大家详细讲解有关JavaScript中macrotask和microtask的区别是怎样的,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。

创新互联,为您提供成都网站建设成都网站制作公司、网站营销推广、网站开发设计,对服务会所设计等多个行业拥有丰富的网站建设及推广经验。创新互联网站建设公司成立于2013年,提供专业网站制作报价服务,我们深知市场的竞争激烈,认真对待每位客户,为客户提供赏心悦目的作品。 与客户共同发展进步,是我们永远的责任!

先来看一段关于promise的常见面试题,写出数字的打印顺序:

setTimeout(function() {
   console.log(4)
},
0);
new Promise(function(resolve) {
   console.log(1)
   for (var i = 0; i < 10000; i++) {
       i == 9999 && resolve()
   }
   console.log(2)
}).then(function() {
   console.log(5)
});
console.log(3);

在输出结果之前,我们先来了解两个概念 macrotasks 和 microtasks。直译过来就是大型任务和微型任务。在javascript中,这两个任务有什么不同呢?microtasks比macrotasks优先执行。

在V8引擎实现中,任务队列分为 macrotasks 和 microtasks。两个队列各包含不同的任务:

macrotasks:script(整体代码),setTimeout, setInterval, setImmediate, I/O, UI rendering 

microtasks:process.nextTick, Promises, Object.observe, MutationObserver。

从列表中可以看出,上述代码中Promise中的then方法中的函数会被推入 microtasks 队列,而setTimeout的任务会被推入 macrotasks 队列。

上述代码在执行过程中遇到了setTimeout,将其回调加入到macrotask queue中, 然后,遇到了promise.then,放入到了另一个队列microtask queue。 等整个主线程执行完后, 就会从microtask queue中取出函数执行,直到microtask queue中的全部任务执行完成,才会执行macrotask queue中的函数。 因此promise.then的回调比setTimeout先执行。

在javascript中,microtask queue会优先于macrotask queue执行。microtask 就相当于头图中的VIP客户,可以随时插队,插入到第一个人和第二个人之间,第一个人相当于正在执行的主线程,而第二个人相当于macrotasks即将要执行的回调。

上面代码的运行结果为:1 2 3 5 4

关于JavaScript中macrotask和microtask的区别是怎样的就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。


分享文章:JavaScript中macrotask和microtask的区别是怎样的
分享网址:http://chengdu.cdxwcx.cn/article/jidpho.html