事件循环有宏任务和微任务;

宏任务所处的队列就是宏任务队列,队列可以有多个,第一个队列只有一个任务就是执行主线程的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的宏任务和微任务有哪些,是怎么执行的 ?的更多相关文章

  1. 10分钟了解js的宏任务和微任务

    熟悉宏任务和微任务以及js(nodejs)事件循环机制,在写业务代码还是自己写库,或者看源码都是那么重要 看了部分文档,自己总结和实践了一下 js中同步任务.宏任务和微任务介绍 同步任务: 普通任务 ...

  2. js中宏任务和微任务

    宏任务包括:<script>整体代码.setTimeout.setInterval.setImmediate.Ajax.DOM事件微任务:process.nextTick.Mutation ...

  3. 宏任务和微任务:setTimeout和Promise执行顺序

    先以一道面试题做引子: 写出这段程序的输出内容: setTimeout(function(){ console.log(); },); new Promise(function(a,b){ conso ...

  4. js中宏任务,微任务,异步,同步,执行的顺序

     [微任务]包括:Promise ,    process.nextTick() *node.js里面的  [宏任务]包括:整体代码script,  setTimeout    setInterval ...

  5. js的事件循环机制:同步与异步任务(setTimeout,setInterval)宏任务,微任务(Promise,process.nextTick)

    javascript是单线程,一切javascript版的"多线程"都是用单线程模拟出来的,通过事件循环(event loop)实现的异步. javascript事件循环 事件循环 ...

  6. js中的宏任务与微任务

    如果你已经知道了js中存在宏任务和微任务,那么你一定已经了解过promise了.因为在js中promise是微任务的一个入口. 先来看一道题: setTimeout(function(){ conso ...

  7. js 宏任务和微任务

    .宏任务(macrotask )和微任务(microtask ) macrotask 和 microtask 表示异步任务的两种分类. 在挂起任务时,JS 引擎会将所有任务按照类别分到这两个队列中,首 ...

  8. JS中的执行机制(setTimeout、setInterval、promise、宏任务、微任务)

    1.执行机制 JS 是单线程的,处理 JS 任务(程序)只能一个一个顺序执行,所以 JS 中就把任务分为了同步任务和异步任务.同步的进入主线程先执行,异步的进入Event Table并注册函数,当指定 ...

  9. JS异步之宏队列与微队列

    1. 原理图 2. 说明 JS 中用来存储待执行回调函数的队列包含 2 个不同特定的列队 宏列队:用来保存待执行的宏任务(回调),比如:定时器回调.DOM 事件回调.ajax 回调 微列队:用来保存待 ...

  10. JS中EventLoop、宏任务与微任务的个人理解

    为什么要EventLoop? JS 作为浏览器脚本语言,为了避免复杂的同步问题(例如用户操作事件以及操作DOM),这就决定了被设计成单线程语言,而且也将会一直保持是单线程的.而在单线程中若是遇到了耗时 ...

随机推荐

  1. 【Tutorial C】08 函数 Function

    函数的定义 C源程序是由函数组成的. 最简单的程序有一个主函数 main(),但实用程序往往由多个函数组成, 由主函数调用其他函数,其他函数也可以互相调用. 函数是C源程序的基本模块,程序的许多功能是 ...

  2. AI机器人——人形机器人、双足机器人、四足机器人 —— 组成构建有哪些?

    参考: https://www.youtube.com/watch?v=dLELvoFt_iA

  3. 如何租GPU:一个价格还算OK的云GPU服务器租赁公司

    一个价格还算OK的云GPU服务器租赁公司. 地址: https://www.gpushare.com/

  4. 强化学习中子进程调用atari游戏是否受父进程中设置的随机种子影响

    相关: python中numpy.random.seed设置随机种子是否影响子进程 ============================================ 代码: from ale_ ...

  5. 惠普暗影精灵2pro挑电池和电源适配器

    自己几年前买的暗影2pro前几个月坏掉了,无法充电,而且偶发性掉电,经过长时间研究发现该款电脑存在挑电池和电源适配器的问题. 相关资料: https://www.chinafix.com/thread ...

  6. springboot接口入参下划线转驼峰以及返回参数驼峰转下划线实现

    1.背景 在实际开发中,通常来说java里面是使用驼峰的命名规则; 但是有时候在对接其他三方平台的接口时,要求使用下划线的命名规则,这时候就涉及到如何让自己的接口满足三方平台的下划线; 实现方式有 1 ...

  7. c++高效位运算函数之 __builtin_

    https://www.cnblogs.com/tldr/p/11288935.html int __builtin_ffs (unsigned int x) 返回x的最后一位1的是从后向前第几位,比 ...

  8. THUPC2024 初赛

    <南开大学数分I月考III在初赛开始四十分钟时结束> 早晨试图速成泰勒展开失败了 考试前 zsy 把 yzf 接到学校了,应该是国赛后第一次见 yzf 考完试发现 yzf 已经买好 KFC ...

  9. 使用Istio服务网格进行微服务网络治理

    在Rainbond中,用户可以对不同的应用设置不同的治理模式,即用户可以通过切换应用的治理模式,来按需治理应用,这样带来的好处便是用户可以不被某一个ServiceMesh框架所绑定,且可以快速试错,能 ...

  10. 【1】Kaggle赛题解读:RSNA 2024 Lumbar Spine Degenerative Classification

    赛题名称:RSNA 2024 Lumbar Spine Degenerative Classification 中文:腰椎退行性病变分类 kaggle官网赛题链接:https://www.kaggle ...