JavaScript中宏任务和微任务初识

最新推荐文章于 2025-06-17 08:13:33 发布
转载 最新推荐文章于 2025-06-17 08:13:33 发布 · 137 阅读 · 0 ·
CC 4.0 BY-SA版权
原文链接：https://juejin.im/post/5cda7ea96fb9a0324b27df81
文章标签：

#javascript #ViewUI

本文深入探讨了宏任务和微任务的概念，列举了浏览器和Node.js环境下常见的宏任务和微任务类型，如setTimeout、setInterval、requestAnimationFrame及Promise等，并解释了它们的执行顺序和机制。

浏览器中默认当前栈（宏任务）执行完毕后会清空微任务列表，微任务清空完成之后取下一个宏任务执行，执行过程中如果注册一些微任务，会在执行下一次宏任务之前再清空一次微任务......

先认识一下宏任务和微任务都有哪些

宏任务


浏览器Node
setTimeout√√
setInterval√√
setImmediatex√
requestAnimationFrame√x


微任务


浏览器Node
process.nextTickx√
MutationObserver√x
Promise.then catch finally√√


转载于:https://juejin.im/post/5cda7ea96fb9a0324b27df81

事件循环中宏任务 微任务
weixin_49517769的博客
09-28 744
宏任务 微任务
JavaScript 任务队列详解：Event Loop、宏任务与微任务
一萧烟雨任平生
02-17 1696
Event Loop 执行顺序执行同步代码（主线程上的任务）。执行所有微任务（Microtask Queue）。执行一个宏任务（Macrotask Queue）。回到步骤 2，执行所有新的微任务。继续执行宏任务队列中的下一个任务。优先级对比微任务 > 宏任务（微任务会在每个宏任务前全部执行完）。多个微任务会按照添加顺序执行。多个宏任务也是按照添加顺序执行。掌握事件循环（Event Loop）
js中的宏任务和微任务
weixin_44249754的博客
01-13 271
宏任务和微任务的关系 从代码入手最好理解，如下： setTimeout(() => { //执行后 回调一个宏事件 console.log('内层宏事件3') }, 0) console.log('外层宏事件1'); new Promise((resolve) => { console.log('外层宏事件2'); resolve() }).then(() => { console.log('微事件1'); }).then(()=>{
js 宏任务和微任务
weixin_59519449的博客
03-18 4115
1.宏任务和微任务的概念是什么 ？ 宏任务： 是指消息队列中的等待被主线程执行的事件，宏任务执行时都会重新创建栈，然后调用宏任务中的函数，栈也会随着变化，但宏任务执行结束时，栈也会随之销毁。包括整体代码script，setTimeout，setInterval new Promise* 微任务： 可以把微任务看成是一个需要异步执行的函数，执行时机是在主函数执行结束之后、当前宏任务结束之前Promise.then，process.nextTick(node中)*。微任务是基于消息队列、事件循环、UI
宏任务与微任务
最新发布
liuchuan__csdn的博客
06-17 1464
摘要：宏任务（如setTimeout）和微任务（如Promise.then）是JavaScript异步机制的核心概念。宏任务在事件循环开始时执行，微任务则在当前宏任务结束后立即执行。执行顺序遵循同步代码→微任务→宏任务的规律。合理使用两者能优化DOM操作、避免UI卡顿，在浏览器和Node.js环境中存在执行差异。掌握宏微任务机制对编写高性能前端应用和应对技术面试至关重要，其本质在于理解事件循环中不同任务的优先级和执行时机。
js中宏任务和微任务
qq_42994986的博客
08-08 413
在 JS 中，大部分的任务都是在主线程上执行，常见的任务有: 1）渲染事件 2）用户交互事件 3）js脚本执行 4）网络请求、文件读写完成事件等等。 普通任务队列和延迟队列中的任务，都属于宏任务。 对于每个宏任务而言，其内部都有一个微任务队列。 1）将异步回调进行宏任务队列的入队操作。 2）将异步回调放到当前宏任务的末尾。 常见的微任务有MutationObserver、Promise.then(或.reject) 以及以 Promise 为基础开发的其他技术(比如fetch API) 这便是宏任务和微任务
JS宏任务和微任务
m0_73481765的博客
10-23 1910
微任务会优先于下一个宏任务执行，即在当前宏任务执行完毕前，所有微任务都会被执行完毕。需要注意的是，当一个宏任务执行过程中产生新的微任务，这些微任务会在当前宏任务执行完之后立即执行。嵌套关系：在一个宏任务中产生的新的微任务，将会在当前宏任务执行完成后立即执行。而新的宏任务则需要等待当前宏任务执行完毕后才会执行。执行时机：宏任务是在主线程空闲时执行的，而微任务是在当前任务执行结束后立即执行的。执行顺序：宏任务按照先进先出的顺序执行，而微任务则会在下一个宏任务执行前优先执行。
j s中宏任务和微任务
09-19
在JavaScript中，宏任务和微任务是异步执行的两种任务类型。宏任务通常是由浏览器提供的API触发的，例如setTimeout、setInterval和事件监听器等。而微任务通常是由Promise和MutationObserver等机制触发的。 在任务...
js中宏任务和微任务谁先执行
05-12
在JavaScript中，宏任务和微任务都是异步任务，宏任务包括DOM事件、定时器等，而微任务包括Promise、MutationObserver等。微任务的执行优先级比宏任务高，也就是说微任务先于宏任务执行。 举个例子，假设当前执行栈...
01-javascript微任务和宏任务谁先执行
weixin_45553259的博客
01-28 1226
微任务、宏任务
宏任务和微任务的理解
vaelcy的博客
07-19 1789
一文搞懂宏任务和微任务
JS中的宏任务与微任务
ct5211314的博客
04-07 1350
JS是单线程语言，在同一时间内，只能做一件事，所以当某一个任务花费时间过长时，会造成程序的卡顿，所以Event Loop（事件循环）的方案应运而生，指定了，多个任务的执行顺序。
javascript中的宏任务和微任务
qq_42099097的博客
07-10 1021
一、宏任务 1.宏任务所处得对了就是宏任务队列。 2.第一个宏任务队列中只有一个任务：执行主线程得js代码 3.宏任务队列可以有很多个。 4.当宏任务队列中的任务全部执行完之后，会查看当前是否有微任务，当当前的伟任务执行完之后，才会执行接下来的宏任务队列 5.eg：setTimeout ,setInterval,requestAnimationFrame 二、微任务 1.微任务所处的队列就是微任务队列 2.只有一个微任务队列 3.在上一个宏任务队列执行完毕后，如果有微任务队列，就会执行微任
js中的宏任务与微任务
weixin_51170516的博客
01-20 407
众所周知js是单线程，但js是可以执行同步和异步任务的，同步的任务众人皆知是按照顺序去执行的 而异步任务的执行，是有一个优先级的顺序的，包括了 宏任务（macrotasks） 和 微任务(microtasks) 宏任务包括：setTimeout setInterval Ajax DOM事件 微任务：Promise async/await 微任务比宏任务的执行时间要早 每次执行栈执行完所有的同步任务后，会在任务队列中取出异步任务，先将所有微任务执行完成后，才会执行宏任务所以可以得出结论， 微任务会在宏任
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值