JavaScript宏任务和微任务（setTimeout，Promise）

最新推荐文章于 2025-07-15 12:22:45 发布
原创 最新推荐文章于 2025-07-15 12:22:45 发布 · 613 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript #开发语言 #ecmascript

本文介绍了JavaScript中setTimeout、setInterval的基本使用，展示了Promise处理异步流程控制的方法，并提到了process.nextTick的作用。通过实例解析了宏任务与微任务的执行顺序。

<html>
    <head>

    </head>
    <body>
        <script>
            console.log('hello first')
            // 立即异步执行  宏任务 队列
            // HTML5 规范规定最小延迟时间不能小于 4ms ，即 x 如果小于 4 ，会被当做 4 来处理。 不过不同浏览器的实现不一样，比如，Chrome可以设置1ms，IE11/Edge是4ms。
            setTimeout(function () {
                console.log('setTimeout immediately')
            }, 0)

            // 延时1000ms后 宏任务 队列
            var timeoutId = setTimeout(function () {
                console.log('setTimeout after 1000 ms')
            }, 1000)

最低0.47元/天 解锁文章
js同步任务，宏任务，微任务 await promise setTimeout
FE攻城狮
06-29 694
1、弄清楚执行顺序，就要弄清楚哪里是要进宏任务队列，哪里是要进微任务队列，哪个是同步代码，哪个是异步代码。 2、await上面的代码和后面的代码是直接执行的，await下面的代码是要进微任务队列的 3、promise的resolve是同步执行的，then里的代码是要进微任务队列的 4、setTimeout是进宏任务队列的 5、代码先执行同步代码，后执行任务队列 6、先执行微任务队列，后执行宏任务队列 7、队列秉持先进先出原则！！！...
Javascript——宏任务&&微任务与JavaScript引擎的事件循环（Event Loop）和任务调度
weixin_45705239的博客
08-07 2084
这两类任务是异步执行的,它们与JavaScript引擎的和任务调度有关。理解这一机制对于掌握JavaScript中的异步编程至关重要。
前端面试题：setTimeout是宏任务还是微任务？
qq_46582421的博客
02-28 1930
宏任务。
js 事件循环，宏任务、微任务，setTimeout
weixin_43915401的博客
03-03 598
Javascript 有一个 main thread 主线程和 call-stack 调用栈(执行栈)，所有的任务都会被放到调用栈等待主线程执行。 同步任务会在调用栈中按照顺序等待主线程依次执行 异步任务会先进入Event Table并注册函数，当指定的事情完成后，Event Table会将注册的回调函数放入移入Event Queue，等待主线程空闲的时候（调用栈被清空），被读取到栈内等待主线程的执行。 宏任务 MacroTask：script全部代码、setTimeout、setInterval、se
js的setTimeout和Promise---同步异步和微任务宏任务
weixin_34050389的博客
01-26 1225
久经前端开发沙场，会经历各式各样的需求，处理这些需求时候，会使用各种各样的api和功能，这里集中对setTimeout和Promise的异步功能进行讨论一下。 单独使用的执行模式 这里就使用Promise作为例子，来探究一下单独使用它，会有哪些注意点。 1.最初的试探 执行代码，Promise的基本使用： let fn = () =...
setTimeout和Promise，对macrotasks（宏任务），microtasks（微任务）的理解
Little_Pig_Bug的博客
11-14 820
console.log(1); setTimeout(function(){ console.log(2); }, 0); Promise.resolve().then(function(){ console.log(3); }).then(function(){ console.log(4); }); console.log(5); 结果：1,5,3,4,2 javascrip...
setTimeout和Promise区别（宏任务和微任务）
u011200562的博客
05-05 3198
javascript的宏任务和微任务 宏任务有Event Table、Event Queue，微任务有Event Queue 1.宏任务：包括整体代码script，setTimeout，setInterval、I/O、UI 交互事件、setImmediate(Node.js 环境)； 2.微任务：Promise、MutaionObserver、process.nextTick(Node.js 环境) 注：new Promise中的代码会立即执行，then函数分发到微任务队列，process.next
一分钟理解JavaScript宏任务和微任务
weixin_44739881的博客
10-17 1457
JavaScript是单线程的。所以有了同步异步的概念，想必不用说了，异步如常见的setTimeout、Promise。这两个东西却有本质上的区别。setTimeout是宏任务，Promise是微任务。 同为宏任务的有setInterval等，同为微任务的有Node的process.nextTick等。见下图。相比于宏任务，微任务的开销会小一点。 JS代码执行的顺序是，按着主线程执行代码，当遇到一...
JavaScript 中的宏任务与微任务：深入理解事件循环
lina_mua的博客
03-18 791
事件循环是 JavaScript 运行时处理异步操作的机制。它通过不断地检查任务队列，执行任务，从而实现非阻塞的异步操作。宏任务与微任务是 JavaScript 事件循环的核心概念，理解它们的执行顺序和应用场景，对于编写高效的异步代码至关重要。
微任务 宏任务 promise settimeout
qq_38935512的博客
02-03 1159
宏任务 ：setTimeout、setInterval 宏任务 ：promise nixtTick EvenT Loop JS得事件循环机制 js得执行模式有点像排队得模式，执行完一个执行下一个，这时候有一些任务需要很长时间才能完成，这时候就有了一个异步队列,将这些任务放到异步队列中，当主线程执行完毕以后，再执行异步队列中得任务列表。 异步队列 分为微任务 和 宏任务，先执行所有得微任务，完毕之后再执行宏任务， 这里看看代码得一个执行先后顺序 注意下：new Promise得方法和.then（）中得代.
一道题理解setTimeout,Promise,async/await以及宏任务与微任务
weixin_30572613的博客
07-15 541
今天看到这样一道面试题： //请写出输出内容 async function async1() { console.log('async1 start'); await async2(); console.log('async1 end'); } async function async2() { console.log('async2');...
宏任务，微任务，事件循环event loop、setTimeout,setInterva、nextTick与process.nextTickl区别【示例讲解】
luemeon的博客
09-21 1282
不同设备的屏幕刷新频率可能不同， setTimeout/setInterval只能设置固定的时间间隔，这个时间和屏幕刷新间隔可能不同。，只会被推入到更新队列中一次，可以避免重复修改相同的dom，这种去除重复数据，对于避免不必要的计算和 DOM 操作是非常重要的。考虑极端情况，假如定时器里面的代码需要进行大量的计算，或者是DOM操作，代码执行时间超过定时器的时间，会出现定时器不准的情况。setTimeout/setInterval是宏任务，根据事件轮询机制，其他任务会阻塞或延迟js任务的执行。
宏任务和微任务
qq_52666510的博客
07-16 351
宏任务：整体代码script，setTimeout，setInterval 微任务：Promise，process.nextTick setTimeout是宏任务，先放入到宏任务的event队列里面，然后代码继续往下查看是否有微任务，promise的then函数把它放入了微任务序列，等到主线程的所有代码执行结束后，先从微任务队列里拿掉函数，最后微任务队列空了后再从宏任务队列中拿函数。 即：用通俗的话来说，先执行微任务中的promise中的，再执行script函数里面的console.log里面的，
Day 257/300 JS中宏任务（setTimeout）和微任务（async await）的执行顺序的demo
xinghuowuzhao的博客
09-02 189
2、遇到await后面非当前行的内容，是在函数执行后，才执行的；1、遇到await后面当前行的内容（无论语句还是函数方法）；3、宏任务队列中会按照push进去的先后顺序，依次打印输出；
js的eventloop中的宏任务和微任务理解，实现对setTimout定时器补偿
有问题 ! 请留言 !
03-26 611
js的eventloop中的宏任务和微任务理解，实现对setTimout定时器补偿 写有关宏任务和微任务的优秀博文有很多已经差不多讲的很详细，写这边博客并不是要做一个补充， 大略只是对自己学习理解做一个记录补充，同时进行分享。有助于输出推动学习。 外文链接：https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/...
JavaScript任务队列--宏任务与微任务详解
最新发布
m0_64378422的博客
07-15 924
宏任务和微任务是 JavaScript 异步执行机制的核心组成部分。它们之间的调度顺序直接影响着代码的执行结果和性能优化。通过合理地使用这两种任务类型，开发者可以创建出高效、流畅的用户界面，并确保异步操作按预期执行。希望通过本文，你能更深入地理解宏任务和微任务在 JavaScript 中的运作机制，并在实际项目中充分利用这些知识来提升代码性能和可维护性。
setTimeout原理
Christlxl的博客
01-31 1078
steTimeout
宏任务与微任务的理解
weixin_47981807的博客
01-15 8640
宏任务与微任务的理解 宏任务一般是：包括整体代码script、settimeout、setInterval、i/o、ui render 微任务：promise、object.observe、MutationObserver 两者的区别 宏任务 宏任务所处的队列就是宏任务队列 宏任务队列可以有多个 当宏任务队列中的任务全部执行完以后就会查看是否有微任务队列 如果有就先执行微任务队列中的所有任务，如果没有就查看是否有宏任务队列 微任务 微任务所处的队列就是微任务队列 只有一个微任务队列 在上一个宏任.
探究JavaScript宏任务与微任务触发机制
资源摘要信息:"在浏览器中，JavaScript 的运行环境被分为同步任务和异步任务，异步任务又分为宏任务（Macrotask）和微任务（Microtask）。本文将详细介绍浏览器中宏任务和微任务的触发机制，以及它们在JavaScript...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

编程经验随笔

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值