js事件循环机制微宏任务执行过程（超详细）

最新推荐文章于 2023-04-10 11:27:00 发布
最新推荐文章于 2023-04-10 11:27:00 发布
阅读量186 收藏
点赞数
分类专栏： 前端技术 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38847914/article/details/123864191
版权

**1.js因为是单线程语言，为了避免阻塞设计出了事件循环机制

2.js任务分为同步任务和异步任务，同步任务会放到主线程中，而异步任务会放入任务队列中

3.异步任务分为宏任务和微任务，js会将宏任务放入宏任务队列中，微任务放入微任务队列中，第一轮先执行宏任务队列里面的任务，如果此时宏任务队列的其中一轮结束后，调用栈清空了，事件循环机制又发现微任务，并且会清空微任务队列，才会看一下需不需要渲染，此时将进入下一轮宏任务，如果最后微任务队列中没有微任务了，此时宏任务队列中还存在多个宏任务将会依次放入调用栈中进行执行**

积极向上的龙
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
宏任务与微任务的理解
weixin_47981807的博客
01-15 7797
宏任务与微任务的理解 宏任务一般是：包括整体代码script、settimeout、setInterval、i/o、ui render 微任务：promise、object.observe、MutationObserver 两者的区别 宏任务 宏任务所处的队列就是宏任务队列 宏任务队列可以有多个 当宏任务队列中的任务全部执行完以后就会查看是否有微任务队列 如果有就先执行微任务队列中的所有任务，如果没有就查看是否有宏任务队列 微任务 微任务所处的队列就是微任务队列 只有一个微任务队列 在上一个宏任.
JS事件循环——宏任务和微任务
友人C君的博客
12-04 2161
首先说说结论，对于面试题和日常工作而言，常用的就是对 Promise 和 async/await 的使用了，尤其是面试题，更是会用各种组合来考验你对宏任务微任务的执行顺序。 结论： 执行完一个宏任务然后会将微任务队列的所有微任务执行完，然后再去异步定时器队列 去执行里面的定时器任务（即使定时器里有微任务，如then回调和async/await函数等）。 当Promise有多个then回...
什么是宏任务与微任务？
知行合一
04-06 7616
我们都知道 Js 是单线程的，但是一些高耗时操作带来了进程阻塞的问题。为了解决这个问题，Js 有两种任务的执行模式：同步模式（Synchronous）和异步模式（Asynchronous） 在异步模式下，创建异步任务主要分为宏任务与微任务两种。ES6 规范中，宏任务（Macrotask） 称为 Task， 微任务（Microtask） 称为 Jobs。宏任务是由宿主（浏览器、Node）发起的，而微任务由 JS 自身发起。 宏任务与微任务的几种创建方式 宏任务（Macrotask） 微任务（Mic
干货：宏任务和微任务执行顺序详解
frontend_frank的博客
04-10 1487
最近看了死月的 趣学 Node.js 小册，关于宏任务、微任务部分突然意识到所谓的执行顺序其实就是底层 C++ 写的各种代码的结果，当了解了 Node.js 代码或者 V8 代码再看这些问题真的就是降维打击（当然我只是有了这个感觉，还没细看过[旺柴]）。但如果平常用不到，我们也没必要真的去看底层的代码，即使不了解底层代码，我们也可以根据具体的表现来自己定一些规则进行理解，只要根据这个规则来判断...
宏任务和微任务
weixin_49592687的博客
05-09 437
1. 进程、线程和协程 进程 进程是计算机中的程序关于某数据集合上的一次运行活动，是系统进行资源分配和调度的基本单位，是操作系统结构的基础。 线程 线程是进程中的一个实体，是被系统独立调度和分派的基本单位 ,分为主线程和子线程(主线程的优先级要绝对大于子线程) 协程 协程是一种比线程更加轻量级的一种函数 正如一个进程可以拥有多个线程一样，一个线程可以拥有多个协程。 三者的不同 : 协程既不是进程也不是线程，协程仅是一个特殊的函数。协程、进程和线程不是一个维度的。 一个进程可以包含多
JS事件循环机制event loop宏任务微任务原理解析
10-14
主要介绍了JS事件循环机制event loop宏任务微任务原理解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
详解JS浏览器事件循环机制
10-17
主要介绍了JS浏览器事件循环机制，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
详解JavaScript事件循环机制
12-09
众所周知，JavaScript 是一门单线程语言，虽然在 html5 中提出了 Web-Worker ，但这并未改变 JavaScript 是单线程这一核心。可看HTML规范中的这段话： To coordinate events, user interaction, scripts, rendering...
事件循环机制和执行上下文带你理解JS运行
01-08
相信大家对计算机网络知识有了一些了解了，接下来我会继续写TCP/IP协议的知识等，这里我先给大家插一篇Javascript一个大家比较关心的知识点，事件循环和执行上下文 先给大家讲执行上下文 在浏览器输入url之后按回车...
JS中的eventLoop事件循环以及宏微任务的个人想法阐述
awawaw154的博客
02-22 199
1.线程与同异步 首先，js只能是单线程语言，因为他是操作dom的话多线程是操作不了的。 单线程意味着所有代码执行必须是一一先后执行。 但若有像定时器那样的任务就会影响后续代码的执行影响dom渲染。 所以js将任务机制分为同步任务和异步任务，任务在主线程(刚刚说的一条线程中)执行， 同步的按顺序执行，异步的就先交给 其他模块 处理，有结果后 再把回调函数拿到 task Queue 任务队列中等待同步任务进行完后再执行。 2.先不谈宏任务和微任务，先分同步任务和异步任务去做个初步理解 3.现在把这个总的任务
搞懂JS的事件循环（Event Loop）和宏任务/微任务
油墨香^-^的博客
05-26 236
事件循环与消息队列 首先大家都知道js是一门单线程的语言，所有的任务都是在一个线程上完成的。而我们知道，有一些像I/O，网络请求等等的操作可能会特别耗时，如果程序使用"同步模式"等到任务返回再继续执行，就会使得整个任务的执行特别缓慢，运行过程大部分事件都在等待耗时操作的完成，效率特别低。 为了解决这个问题，于是就有了事件循环（Event Loop）这样的概念，简单来说就是在程序本身运行的主线程会形成一个"执行栈"，除此之外，设立一个"任务队列",每当有异步任务完成之后，就会在"任务队列"中放置一个事件，
javascript的宏任务和微任务
热门推荐
lc237423551的博客
04-11 7万+
今天进行了人生中的第一次面试。结果凉凉了。但是还是学到了很多东西。其中在面试时面试官问了我一道题 setTimeout(function(){ console.log('1') }); new Promise(function(resolve){ console.log('2'); resolve(); }).the...
js中的事件循环机制（宏任务和微任务都有哪些）
CC酱写前端的博客
06-28 676
js循环机制，微任务宏任务
JS事件循环机制（微任务和宏任务）
yupyuping的博客
04-22 501
1 event loop 是什么 event loop（事件循环/事件轮询） JS是单线程运行的 异步要基于回调来实现 event loop 就是异步回调的实现原理 JS如何执行？ 从前到后，一行一行执行 如果某一行执行报错，则停止下面代码的执行 先把同步代码执行完，再执行异步 2 event loop 运行过程 过程1： 同步代码，一行一行放在Call Stack 执行 遇到异步，会先 “记录” 下，放到 Web APIS， 等待时机(定时，网络请求等） 时机到了，就移动到 Ca..
js事件循环:宏任务与微任务
m0_58399188的博客
08-14 468
js代码执行顺序:一个宏任务->多个微任务->一个宏任务->多个微任务,如此循环,就叫事件循环event loop js一次只能执行一个宏任务,一次可以执行多个微任务 1.两个定时器中的回调函数都是宏任务 2.promise中的resolve和reject都是是微任务 3主线程的执行栈中的所有同步任务可以看作是一个宏任务 console.log(0) setTimeout(() => { console.log(1) }, 0) new Promise((resolve) =&
js 单线程、宏任务与微任务的区别以及执行顺序是什么
小草莓的博客
07-22 2781
宏任务：指消息队列中的等待被主线程执行的事件宏任务执行时都会重新创建栈，然后调用宏任务中的函数，栈也会随着变化。但宏任务执行结束时，栈也会随之销毁。微任务：可以看成是一个需要异步执行的函数微任务是基于消息队列、事件循环、UI 主线程还有堆栈而来的微任务的执行时机：在主函数执行结束之后、当前宏任务结束之前。
JavaScript事件轮询、微任务和宏任务
远方
12-06 6940
JavaScript是单线程语言，也就是说同一个事件只能做一件事。虽然HTML5提出了Web Worker，允许JavaScript脚本创建多个线程，但是子线程完全受主线程控制，且不得操作DOM和BOM。所以，依然没有改变JavaScript是单线程的本质。 为了解决单线程导致的线程等待资源，cpu空闲，而其他任务一直等待的问题。将所有的任务分为两种，一种是同步任务，一种是异步任务。同步任务指的是...
事件循环中的宏任务和微任务执行顺序
苦涩精灵的博客
11-15 8042
事件循环中的宏任务和微任务执行顺序 先来了解一下事件循环、宏任务、微任务和Promise 1.事件循环（Event Loop）运行机制 执行一个宏任务（栈中没有就从事件队列中获取） 执行过程中如果遇到微任务，就将它添加到微任务的任务队列中 宏任务执行完毕后，立即执行当前微任务队列中的所有微任务（依次执行） 当前宏任务执行完毕，开始检查渲染，然后GUI线程接管渲染 渲染完毕后，JS线程继续接管，开始下一个宏任务（从事件队列中获取） 2.宏任务、微任务 执行顺序： 先宏后微 宏任务（发起者:宿主（Node、
精学JS：宏任务 & 微任务的运行机制
Ben_Simons
06-10 1578
首先分析宏任务和微任务的运行机制，并针对日常开发中遇到的各种宏任务&微任务的方法，结合一些例子来看看代码运行的顺序逻辑，把这部分知识点重新归纳和梳理。  在日常开发中，例如 setTimeout和 promise都是经常会使用到的 JS方法。当这些方法变多了之后，再结合 JS的异步编程代码混合使用，最终的执行顺序也经常会让开发者迷惑，因此要把这些问题搞清楚，这部分还是有必要好好学习一下。在开始前请先思考一下：开始讲解正式内容之前，我们先看一段代码，算是开胃的前菜，如果之前对这部分知识稍有了解，一般都应该可以
js事件循环机制以及宏任务微任务
最新发布
05-23
JavaScript 是一门单线程语言，也...总结一下，事件循环机制的执行顺序为：执行一个宏任务，接着执行该宏任务的微任务队列中的所有微任务，然后再执行下一个宏任务。这个过程会不断地重复，直到所有任务都被执行完毕。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值