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

Promise事件比timeout优先的更多相关文章

  1. es6 Promise 事件机制分析

    最近在学习es6的Promise,其中涉及到了Promsie的事件执行机制,因此总结了关于Promise的执行机制,若有错误,欢迎纠错和讨论. 在阮一峰老师的书中<es6 标准入门>对Pr ...

  2. nodejs事件和事件循环简介

    目录 简介 事件 事件循环 事件循环的阻塞 事件循环举例 栈和消息队列 作业队列和promise process.nextTick() setImmediate() setInterval() 简介 ...

  3. Promise的前世今生和妙用技巧

    浏览器事件模型和回调机制 JavaScript作为单线程运行于浏览器之中,这是每本JavaScript教科书中都会被提到的.同时出于对UI线程操作的安全性考虑,JavaScript和UI线程也处于同一 ...

  4. angularjs 中的setTimeout(),setInterval() / $interval 和 $timeout

    $interval window.setInterval的Angular包装形式.Fn是每次延迟时间后被执行的函数. 间隔函数的返回值是一个承诺.这个承诺将在每个间隔刻度被通知,并且到达规定迭代次数后 ...

  5. 说说Angular中的$timeOut定时器

     非常不幸的一点是,人们似乎常常将AngularJS中的$timeOut()函数看做是一个内置的.无须在意的函数.但是,如果你忘记了$timeOut()的回调函数将会造成非常不好的影响,你可能会因此遇 ...

  6. AngularJs $interval 和 $timeout

    $interval window.setInterval的Angular包装形式.Fn是每次延迟时间后被执行的函数. 间隔函数的返回值是一个承诺.这个承诺将在每个间隔刻度被通知,并且到达规定迭代次数后 ...

  7. javascript中的promise和deferred:实践(二)

    javascript中的promise和deferred:实践(二) 介绍: 在第一节呢,我花了大量的时间来介绍promises和deferreds的理论.现在呢,我们来看看jquery中的promi ...

  8. Angular - - $interval 和 $timeout

    $interval window.setInterval的Angular包装形式.Fn是每次延迟时间后被执行的函数. 间隔函数的返回值是一个承诺.这个承诺将在每个间隔刻度被通知,并且到达规定迭代次数后 ...

  9. Promise小书(长文)

    promise基础 Promise是异步编程的一种解决方案.ES6 Promise的规范来源于Promises/A+社区,它有很多版本的实现. Promise比传统的解决方案(回调函数和事件)更合理和 ...

随机推荐

  1. webassembly

    为什么需要 WebAssembly 自从 JavaScript 诞生起到现在已经变成最流行的编程语言,这背后正是 Web 的发展所推动的.Web 应用变得更多更复杂,但这也渐渐暴露出了 JavaScr ...

  2. jQuery键盘敲击事件,换键的话换键码就可以

    $("body").keyup(function () { if (event.which == 13){ $("#Btn_login").trigger(&q ...

  3. 利用ASK/OOK 发射模块,实现信号重放

    本文以打开无线控制的电动车库卷帘门为目标,深入研究了ASK/OOK的编/解码,并用树莓派+五元钱的ASK/OOK 发射模块 背景 车库装了电动卷帘门,为了了解其安全性,也是为了能自主控制,研究了下其遥 ...

  4. Java实现数据库与eclipse的连接

    JavaBean:用于传递数据,拥有与数据相关的逻辑处理 JSP:从Model接收数据并生成HTML Servlet:接收HTTP请求并控制Model和View jdbc:用于驱动连接 一.[建立数据 ...

  5. python day18--面向对象,继承

    # class Animal: # breath = '呼吸' # # def __init__(self, name, sex, age): # self.name = name # self.se ...

  6. Dubbo的Filter链梳理---分组可见和顺序调整

    前言: 刚刚写了篇博文: Dubbo透传traceId/logid的一种思路, 对dubbo的filter机制有了一个直观的理解. 同时对filter也多了一些好奇心, 好奇filter链是如何组织的 ...

  7. vim选中多行缩进(python多行缩进)与删除多行前面的空格

    最近用vim写python,有时候会在一段代码前面套一个循环的操作,这个时候将这一段代码整体向后平移四个空格,来满足vim缩进的要求,如何做到这一点呢? 1. ESC之后,ctrl+v进入多行行首选中 ...

  8. 转-软件测试人员在工作中如何运用Linux

    从事过软件测试的小伙们就会明白会使用Linux是多么重要的一件事,工作时需要用到,面试时会被问到,简历中需要写到. 对于软件测试人员来说,不需要你多么熟练使用Linux所有命令,也不需要你对Linux ...

  9. rviz初接触

  10. SQL 入门了解

    SQL 随着应用程序的功能越来越复杂,数据量越来越大,如何管理这些数据就成了大问题: 读写文件并解析出数据需要大量重复代码: 从成千上万的数据中快速查询出指定数据需要复杂的逻辑. 如果每个应用程序都各 ...