JS异步宏队列微队列原理详解


Posted in Javascript onSeptember 09, 2020

先看一张我绘制的原理图

JS异步宏队列微队列原理详解

原理图

setImmediate 也是宏任务,在 Node 环境下,微任务还有 process.nextTick

JS 中用来存储待执行回调函数的队列包含 2 个不同特定的列队

  • 宏列队:用来保存待执行的宏任务(回调),比如:定时器回调、DOM 事件回调、ajax 回调微
  • 列队:用来保存待执行的微任务(回调),比如:promise的回调、MutationObserver 的回调

JS 执行时会区别这 2 个队列

  • JS 引擎首先必须先执行所有的初始化同步任务代码
  • 每次准备取出第一个宏任务执行前, 都要将所有的微任务一个一个取出来执行,也就是优先级比宏任务高,且与微任务所处的代码位置无关

下面这个例子可以看出 Promise 要先于 setTimeout 执行

setTimeout(() => { // 立即放入宏队列
  console.log('settimeout callback1()');
}, 0);
setTimeout(() => { // 立即放入宏队列
  console.log('settimeout callback2()');
}, 0);


Promise.resolve(1).then(value => { // 立即放入微队列
  console.log('Promise onResolved1()', value);
})
Promise.resolve(2).then(value => { // 立即放入微队列
  console.log('Promise onResolved2()', value);
})

// Promise onResolved1() 1
// Promise onResolved2() 2
// settimeout callback1()
// settimeout callback2()

全文完。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery 页面滚动到指定DIV实现代码
Sep 25 Javascript
JavaScript针对网页节点的增删改查用法实例
Feb 02 Javascript
js倒计时简单实现方法
Dec 17 Javascript
jQuery实现的省市联动菜单功能示例【测试可用】
Jan 13 Javascript
ES6新特性之模块Module用法详解
Apr 01 Javascript
基于pako.js实现gzip的压缩和解压功能示例
Jun 13 Javascript
在vscode中统一vue编码风格的方法
Feb 22 Javascript
PM2自动部署代码步骤流程总结
Dec 10 Javascript
Vue注册组件命名时不能用大写的原因浅析
Apr 25 Javascript
基于JS实现数字动态变化显示效果附源码
Jul 18 Javascript
MockJs结合json-server模拟后台数据
Aug 26 Javascript
Node 代理访问的实现
Sep 19 Javascript
vue 项目软键盘回车触发搜索事件
Sep 09 #Javascript
基于原生JS封装的Modal对话框插件的示例代码
Sep 09 #Javascript
vue监听浏览器原生返回按钮,进行路由转跳操作
Sep 09 #Javascript
JS实现斐波那契数列的五种方式(小结)
Sep 09 #Javascript
JavaScript代码简化技巧实例解析
Sep 09 #Javascript
vue 手机物理监听键+退出提示代码
Sep 09 #Javascript
关于angular引入ng-zorro的问题浅析
Sep 09 #Javascript
You might like
[原创]php使用strpos判断字符串中数字类型子字符串出错的解决方法
2017/04/01 PHP
php使用str_replace替换多维数组的实现方法分析
2017/06/15 PHP
php实现微信支付之现金红包
2018/05/30 PHP
什么是PHP7中的孤儿进程与僵尸进程
2019/04/14 PHP
jquery 取子节点及当前节点属性值
2014/07/25 Javascript
AspNet中使用JQuery boxy插件的确认框
2015/05/20 Javascript
深入探究AngularJS框架中Scope对象的超级教程
2016/01/04 Javascript
基于jQuery实现一个marquee无缝滚动的插件
2017/03/09 Javascript
详解nodejs微信jssdk后端接口
2017/05/25 NodeJs
jqueryUI tab标签页代码分享
2017/10/09 jQuery
vue路由拦截及页面跳转的设置方法
2018/05/24 Javascript
在vue项目中使用md5加密的方法
2018/09/14 Javascript
使用vue-router在Vue页面之间传递数据的方法
2019/07/15 Javascript
VueJS 取得 URL 参数值的方法
2019/07/19 Javascript
编写Python脚本把sqlAlchemy对象转换成dict的教程
2015/05/29 Python
python中cPickle类使用方法详解
2018/08/27 Python
python Gunicorn服务器使用方法详解
2019/07/22 Python
Python 私有化操作实例分析
2019/11/21 Python
python @propert装饰器使用方法原理解析
2019/12/25 Python
Pytorch实现LSTM和GRU示例
2020/01/14 Python
opencv-python的RGB与BGR互转方式
2020/06/02 Python
大数据分析用java还是Python
2020/07/06 Python
通过案例解析python鸭子类型相关原理
2020/10/10 Python
Flask中jinja2的继承实现方法及实例
2021/03/03 Python
任意一块网页内容实现“活”的背景(目前火狐浏览器专有)
2014/05/07 HTML / CSS
html5配合css3实现带提示文字的输入框(摆脱js)
2013/03/08 HTML / CSS
详解如何获取localStorage最大存储大小的方法
2020/05/21 HTML / CSS
英国品牌男装折扣网站:Brown Bag
2018/03/08 全球购物
Java面试中常遇到的问题,也是需要注意的几点
2013/08/30 面试题
实习医生自我评价
2013/09/22 职场文书
财务会计专业毕业生自荐信
2013/10/02 职场文书
数学专业毕业生自荐信
2013/11/10 职场文书
会计工作决心书
2014/03/11 职场文书
2014年预备党员学习两会心得体会
2014/03/17 职场文书
党的群众路线教育实践活动个人对照检查材料
2014/09/22 职场文书
如何使用分区处理MySQL的亿级数据优化
2021/06/18 MySQL