js的宏任务和微任务有哪些,是怎么执行的 ?
事件循环有宏任务和微任务;
宏任务所处的队列就是宏任务队列,队列可以有多个,第一个队列只有一个任务就是执行主线程的js代码,剩余队列任务有setTimeout setInterval ;
微任务所处的队列就是微任务队列,只能有一个队列,有process.nextTick() promise.then()
执行顺序:先执行第一个宏任务队列,在执行微任务队列,最后执行宏任务后面的队列 ;
总结: 事件循环先执行宏任务,其中同步任务立即执行,异步任务加载到对应的Event Queue 中,微任务也加载到对应的微任务的 Event Queue 中,所有的同步微任务执行完之后,如果发现微任务的 Event Queue 中有未执行完的任务,先执行他们这样算是完成了一轮事件循环。接下来查看宏任务的队列中是否有异步代码,有的话执行第二轮的事件循环,以此类推。
再来看一个复杂点的例子:
console.log('1'); setTimeout(function() { console.log('2'); process.nextTick(function() { console.log('3'); })new Promise(function(resolve) { console.log('4'); resolve(); }).then(function() { console.log('5')
})
})
//1、2、4、3、5
1、宏任务同步代码 console.log(‘1’)
2、setTimeout,加入宏任务 Event Queue,没有发现微任务,第一轮事件循环走完3、第二轮事件循环开始,先执行宏任务,从宏任务 Event Queue 中独取出setTimeout 的回调函数
4、同步代码 console.log(‘2’),发现 process.nextTick,加入微任务 Event Queue
5、new Promise,同步执行 console.log(‘4’),发现 then,加入微任务 Event Queue
6、宏任务执行完毕,接下来执行微任务,先执行 process.nextTick,然后执行Promise.then
7、微任务执行完毕,第二轮事件循环走完,没有发现宏任务,事件循环结束
js的宏任务和微任务有哪些,是怎么执行的 ?的更多相关文章
- 10分钟了解js的宏任务和微任务
熟悉宏任务和微任务以及js(nodejs)事件循环机制,在写业务代码还是自己写库,或者看源码都是那么重要 看了部分文档,自己总结和实践了一下 js中同步任务.宏任务和微任务介绍 同步任务: 普通任务 ...
- js中宏任务和微任务
宏任务包括:<script>整体代码.setTimeout.setInterval.setImmediate.Ajax.DOM事件微任务:process.nextTick.Mutation ...
- 宏任务和微任务:setTimeout和Promise执行顺序
先以一道面试题做引子: 写出这段程序的输出内容: setTimeout(function(){ console.log(); },); new Promise(function(a,b){ conso ...
- js中宏任务,微任务,异步,同步,执行的顺序
[微任务]包括:Promise , process.nextTick() *node.js里面的 [宏任务]包括:整体代码script, setTimeout setInterval ...
- js的事件循环机制:同步与异步任务(setTimeout,setInterval)宏任务,微任务(Promise,process.nextTick)
javascript是单线程,一切javascript版的"多线程"都是用单线程模拟出来的,通过事件循环(event loop)实现的异步. javascript事件循环 事件循环 ...
- js中的宏任务与微任务
如果你已经知道了js中存在宏任务和微任务,那么你一定已经了解过promise了.因为在js中promise是微任务的一个入口. 先来看一道题: setTimeout(function(){ conso ...
- js 宏任务和微任务
.宏任务(macrotask )和微任务(microtask ) macrotask 和 microtask 表示异步任务的两种分类. 在挂起任务时,JS 引擎会将所有任务按照类别分到这两个队列中,首 ...
- JS中的执行机制(setTimeout、setInterval、promise、宏任务、微任务)
1.执行机制 JS 是单线程的,处理 JS 任务(程序)只能一个一个顺序执行,所以 JS 中就把任务分为了同步任务和异步任务.同步的进入主线程先执行,异步的进入Event Table并注册函数,当指定 ...
- JS异步之宏队列与微队列
1. 原理图 2. 说明 JS 中用来存储待执行回调函数的队列包含 2 个不同特定的列队 宏列队:用来保存待执行的宏任务(回调),比如:定时器回调.DOM 事件回调.ajax 回调 微列队:用来保存待 ...
- JS中EventLoop、宏任务与微任务的个人理解
为什么要EventLoop? JS 作为浏览器脚本语言,为了避免复杂的同步问题(例如用户操作事件以及操作DOM),这就决定了被设计成单线程语言,而且也将会一直保持是单线程的.而在单线程中若是遇到了耗时 ...
随机推荐
- Python列表、元组、字典和集合的用法
1.列表 标志符号是[],元素可以修改.删除和新增 1.1 提取元素(索引从0开始计算) testList=['A','B','C',1,'D'] print(testList[1]) #打印索引区间 ...
- Google的TPU的向量化内存的读取规格——单次读取/写入的数据量
异构加速设备: GPU.TPU.NPU 这几种设备,除了GPU公开了部分硬件设计原理和软件编程范式以外,所有的TPU和NPU的资料都是不公开的,都是被其所属公司保留的,然后这些公司会自己在这些硬件之上 ...
- MindSpore 数据加载及处理
参考地址: https://www.mindspore.cn/tutorial/zh-CN/r1.2/dataset.html ==================================== ...
- 微服务全链路跟踪:springcloud集成jaeger
微服务全链路跟踪:grpc集成zipkin 微服务全链路跟踪:grpc集成jaeger 微服务全链路跟踪:springcloud集成jaeger 微服务全链路跟踪:jaeger集成istio,并兼容u ...
- springboot2集成oauth2坑二(The bean 'scopedTarget.oauth2ClientContext', defined in class path resource )
码云地址:https://gitee.com/lpxs/lp-springcloud.git 有问题可以多沟通:136358344@qq.com. 由于使用Enableoauth2sso注解一直报错, ...
- NCP1207A笔记
uc3844d8 NCP1207A实现一个标准的电流模式结构,关断时间由峰值电流设置决定:铁芯复位检测则触发开启事件. 变压器铁芯检测:无论什么操作都会保证临界操作.因此,几乎没有一次开关接通损耗和二 ...
- cloud compare二次插件化功能开发详细步骤(一)
点云处理,有一个出名的处理软件,cloud compare,简称 cc,将自己实现的功能以插件形式集成到 CC 里,方便使用 前提 环境:cc 2.13,qt 5.15,cmake 3.18,vs20 ...
- B2B进销存ERP后台管理系统的逻辑架构与设计,AxureRP原型产品经理实战案例
模块分析: 进销存系统是一种用于企业管理库存.销售和采购活动的信息系统.它的主要作用包括但不限于以下几个方面: 1.库存管理 实时库存跟踪:准确记录每种商品的库存数量,确保数据的实时性和准确性. 库存 ...
- LaTeX 编译 acmart 文档报错:hyperref must be loaded before hyperxmp.
在编译一篇从 arXiv 下载的文档时遇到如下错误: Package hyperxmp Error: hyperref must be loaded before hyperxmp. 根据 GitHu ...
- vue echarts map 中国地图显示不出来
测试区忽然无法显示中国地图,所以对比了一下测试区与开发环境中echarts版本的区别 测试区echarts版本为 5.4.2 开发环境为5.0.2 所以将package.json中的 "ec ...