动漫引擎

导航

Promise事件比timeout优先

Promise, setTimeout 和 Event Loop

下面的代码段,为什么输出结果是1,2,3,5,4而非1,2,3,4,5?
(function test() {
setTimeout(function() {console.log(4)}, 0);
new Promise(function executor(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);
})()


因为event loop中有多个task 队列,到底有多少个,每个浏览器的实现不同, 其中micro-task队列存放高优先级的任务, macro-task队列存放普通优先级的任务。
* setTimeout 给macro-task队列中添加了一个任务4。
* 创建Promise实例(executor)是同步执行的, 它直接输出1和2
* Promise.then是异步执行的。 其中的resolve, 只是把then的任务,i.e.任务5, 添加micro-task队列中。
* micro-task队列具有高优先级, 所以, 在3之后, 先执行micro-task中的任务5
* 然后是低优先级的macro-task队列中的任务4

 

https://github.com/creeperyang/blog/issues/21

posted on 2017-07-13 06:27  动漫引擎  阅读(268)  评论(0编辑  收藏  举报