JavaScript中微任务和宏任务

最新推荐文章于 2022-09-04 23:27:44 发布

原创最新推荐文章于 2022-09-04 23:27:44 发布 · 207 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

本文深入探讨了宏任务和微任务的概念及其执行顺序，包括script、setTimeout、setInterval等宏任务类型，以及Promise.then、MutationObserver等微任务类型的运作机制。

宏任务

script(整体代码)
setTimeout
setInterval
I/O
UI交互事件
postMessage
MessageChannel
setImmediate(Node.js)

微任务

Promise.then
Object.observe
MutaionObserver
process.nextTick(Node.js)

执行顺序

宏任务-->微任务-->渲染-->宏任务

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

透明的前端

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

javaScript中微任务宏任务详解

Yiu的博客

04-02

1038

【代码】javaScript中微任务宏任务详解。

Vue学习记录之十九 Event Loop,宏任务和微任务

LvManBa的博客

10-22

1145

当一个宏任务执行完毕后，会检查是否有微任务队列，如果有，则将微任务队列中的所有任务依次执行完毕，然后再继续选择下一个宏任务执行。这样的过程循环进行，形成了事件循环。微任务通常在宏任务执行完毕后立即执行，因此微任务具有更高的优先级，可以在页面渲染前执行，从而提供更好的用户体验。微任务的优先级高于宏任务，因此微任务会在本轮宏任务执行结束后立即执行，而不是等到下一个事件循环。按顺序执行，同步任务直接执行，异步任务进入异步队列，执行完以后，在进行入异步列队，然后在看是同步还是异步任务，如此循环执行。

参与评论您还未登录，请先登录后发表或查看评论

js宏任务和微任务

weixin_57750909的博客

06-10

2671

js中的一个机制，就是遇到宏任务，先执行宏任务，将宏任务放入eventqueue，然后在执行微任务。宏任务和微任务都包含一些事件宏任务：setTimeout,setInterval,Ajax,DOM事件微任务：Promise async/await 要想明白这个机制就要理解js单线程。因为JS是单线程语言，只能同时做一件事儿。js任务需要排队顺序执行，如果一个任务时间过长，后边的任务也会等着。假如，我们在请求一个网址时，图片加载很慢，网页总不能一直卡不出来，这个时候就可以...

MessageChannel的使用

sumtre_w的博客

08-29

1358

我们知道：在浏览器环境中，常见的 macro task 有 setTimeout、MessageChannel、postMessage、setImmediate。而常见的 micro task 有 MutationObsever 和 Promise.then。 Vue中对于 macro task 的实现，优先检测是否支持原生 setImmediate，这是一个高版本 IE 和 Edge 才支持的特性，不支持的话再去检测是否支持原生的MessageChannel，如果也不支持的话就会降级为 setTimeou

宏任务与微任务

w96098的博客

03-17

211

宏任务微任务任务的优先级宏任务macrotask：主代码块 > setImmediate > MessageChannel > setTimeout / setInterval (大部分浏览器会把DOM事件回调优先处理因为要提升用户体验给用户反馈，其次是network IO操作的回调，再然后是UIrender，之后的顺序就难以捉摸了，其实不同浏览器的表现也不太一样，这里不做过多讨论。) 微任务microtask：process.nextTick > Promise =

【React Scheduler源码第一篇】哪些API适合用于任务调度

lzc的博客

09-04

465

了解屏幕刷新率，了解哪些API 适合用于React Scheduler任务调度。为后续的手写scheduler源码奠定基础

JavaScript关于宏任务与微任务

YanHSama的博客

08-13

1426

js事件循环、宏任务和微任务理解

详细说明js中微任务和宏任务

04-14

微任务和宏任务是 JavaScript 中两种不同的任务队列，它们在事件循环中起到不同的作用。宏任务是指触发一次执行的任务队列，比如 setTimeout 和 setInterval。这些任务被推入宏任务队列，并按照先进先出的顺序依次...

微任务和宏任务

最新发布

03-29

好的，我现在需要回答用户关于JavaScript中微任务和宏任务的区别及执行顺序的问题。首先，我得回忆一下自己之前学过的相关知识，确保概念正确。用户提到了参考的引用[1]和[2]，需要结合这些内容来组织答案。根据...

JavaScript微任务与宏任务的执行机制解析

以上是从给定文件信息中提取的知识点，重点涵盖了JavaScript中微任务和宏任务的概念、区别、特点以及它们在事件循环中的工作方式。希望这些信息能帮助开发者深入理解JavaScript的异步编程模型，从而在实际开发中更...

编码、加密、令牌化区别详解

油墨香^-^的博客

08-08

387

《数据安全技术对比：编码、加密与令牌化》编码用于数据格式转换（如Base64），可逆且无安全性；加密通过密钥保护数据机密性（如AES），需密钥解密；令牌化用随机值替代敏感数据（如支付卡号），不可逆且依赖令牌库。核心区别：编码解决格式问题，加密确保保密性，令牌化专注敏感信息保护。选择技术需考虑场景——传输兼容用编码，防窃听用加密，降低数据泄露风险用令牌化。哈希则适用于密码存储等单向验证场景。

宏任务和微任务的理解

vaelcy的博客

07-19

1864

一文搞懂宏任务和微任务

JavaScript中的宏任务和微任务简单区分

码农桃子的博客

07-14

1536

因为宏任务太占用性能，当需要一些较早就准备好的方法，排在最后才执行的时候，又不想新增一个宏任务，那么就可以把这些方法，一个一个的放在微任务队列里面，在这个宏任务中的代码执行完后，就会执行微任务队列。异步任务指的是，不进入主线程、而进入"任务队列"的任务，只有等主线程任务执行完毕，"任务队列"开始通知主线程，请求执行任务，该任务才会进入主线程执行。而异步任务，又分为宏任务和微任务，这两个任务是两个队列，所以是先进先出的。同步任务指的是，在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务。

浏览器事件环，微任务和宏任务

路海平的博客

12-15

945

宏任务 setTimeout setImmediate MessageChannel 微任务 Promise.then MutationObserver

node基础面试事件环？微任务、宏任务？一篇带你飞

weixin_33887443的博客

06-20

372

培育能力的事必须继续不断地去做，又必须随时改善学习方法，提高学习效率，才会成功。 —— 叶圣陶一、我们为什么要使用node，它的好处是什么？ Node的首要目标是提供一种简单的，用于创建高性能服务器的开发工具。还要解决web服务器高并发的用户请求。解决高并发？我们这里来举个例子，我们node和java相比，在同样的请求下谁更占优一点。看图...

React Scheduler 时间分片为什么选择使用 MessageChannel 实现

我本可以容忍阳光，如果我不曾见过太阳，然而阳光已使我荒凉，成为更新的荒凉。

05-08

2740

点击上方前端瓶子君，关注公众号回复算法，加入前端编程面试算法每日一题群来源：MoonBallhttps://juejin.cn/post/6953804914715803678本文包括：...

同步任务、异步任务、宏任务、微任务基本概念

这个昵称没有被占用吧的博客

11-13

5069

**同步任务：**指的是在主线程傻姑娘排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务。 **异步任务：**指的是不进入主线程，某个异步任务可以执行了，该任务才会进入主线程执行。异步执行的运行机制如下(同步任务也如此，因为它可以被视为没有异步任务的异步执行)：所有同步任务都在主线程上执行，形成一个执行栈(execution context stack) 主线程之外，还存在一个“任务...

JavaScript事件轮询、微任务和宏任务

远方

12-06

7628

JavaScript是单线程语言，也就是说同一个事件只能做一件事。虽然HTML5提出了Web Worker，允许JavaScript脚本创建多个线程，但是子线程完全受主线程控制，且不得操作DOM和BOM。所以，依然没有改变JavaScript是单线程的本质。为了解决单线程导致的线程等待资源，cpu空闲，而其他任务一直等待的问题。将所有的任务分为两种，一种是同步任务，一种是异步任务。同步任务指的是...