宏任务和微任务

javasript宿主环境有事件循环，异步任务会被加入到任务队列，任务队列分为两种，宏任务(macroTask)和微任务(microTask)。

宏任务队列会有多个，微任务队列只有一个。

每次事件循环，先执行微任务队列，执行完后，会选择一个宏任务队列执行，然后再次执行微任务队列，完成后再挑一个宏任务队列执行..

总之，就是 microTask queue -> macroTask queue -> microTask queue -> macroTask queue ....

结果是，微任务会先于宏任务执行。

Microtasks：

process.nextTick
promise
Object.observe
MutationObserver

Macrotasks:

setTimeout
setInterval
setImmediate
script（全局任务）
I/O（例如ajax）
UI渲染

优先级：process.nextTick > promise , setImmediate > setTimeout

速记：微任务，所有p开头的和观察的；宏任务，所有set开头的，以及大块操作，例如script标签，IO，UI渲染

原文地址：https://www.cnblogs.com/mengff/p/11739189.html

时间： 2024-11-09 00:34:08

宏任务和微任务的相关文章

js 宏任务，微任务

在了解async之后,发现一个自己不是很熟悉的点儿,在这儿记录一下 js 中存在宏任务和微任务,js 的执行顺序是一个宏任务执行结束之后才会去执行下一个宏任务,微任务是在本宏任务的主要的任务结束之后,再去执行微任务,当所有的微任务结束之后,这个宏任务也就算执行结束了,值的注意的是,script 就是一个大的宏任务先分类: 宏任务 srcipt > setImmediate > messageChannel > setTimeout/setInterval

js的事件循环机制：同步与异步任务（setTimeout，setInterval）宏任务，微任务（Promise，process.nextTick）

javascript是单线程,一切javascript版的"多线程"都是用单线程模拟出来的,通过事件循环(event loop)实现的异步. javascript事件循环事件循环中的同步任务,异步任务: 同步和异步任务在不同的执行"场所",同步的进入主线程,异步的进入Event Table执行并注册函数. 当指定的异步事情完成时,Event Table会将这个函数移入Event Queue. 主线程内的任务执行完毕为空,会去Event Queue读取对应的函数,推

js 宏任务和微任务

1.概念:宏任务(macrotask )和微任务(microtask ) 表示异步任务的两种分类.常见宏任务:I/O .setTimeout.setInterval:微任务:Promise.then catch finally.process.nextTick 在挂起任务时,JS 引擎会将所有任务按照类别分到这两个队列中, 首先在 macrotask 的队列(这个队列也被叫做 task queue)中取出第一个任务,执行完毕后取出 microtask 队列中的所有任务顺序执行: 之后再取 m

12. 宏任务_微任务

执行过程: 每当执行栈为空时,就检查微任务,有则进栈执行,栈空了再去查微任务, 直到没有微任务时,去宏任务中取一个进栈执行,栈空了又开始检查微任务,循环往复,直至全都为空宏任务: I/O (click事件.fs.writeFile) setTimeout setInterval setImmediate (nodejs) requestAnimationFrame 微任务 process.nextTick (nodejs) Promise.then().catch() console.log(

常见宏任务与微任务

宏任务(macrotasks): 主js.UI渲染.setTimeout.setInterval.setImmediately.requestAnimationFrame.I/O等微任务(microtasks):process.nextTick().promise.Object.observe()等原文地址:https://www.cnblogs.com/yanze/p/11820302.html

宏任务与微任务

老规矩,先放两道题目,先看看会有什么结果输出,然后我们一起研究为什么 async function async1(){ console.log("async1 start"); await async2(); console.log("async1 end"); } async function async2(){ console.log("async2"); } console.log("script start"); se

正常任务（宏任务）和微任务

最近突然被问到关于正常任务(宏任务)和微任务的问题,学习js这么长时间来,还没有注意到js的任务还有宏任务和微任务的区别,在网上查找以后大概知道了什么是宏任务和微任务. 首先,宏任务包含:setTimeout/setInterval/setImmediate/整体代码script 而微任务包含:promise和process.nextTick 从结果来说,两者的区别在于在事件循环机制中,执行的机制不同,具体执行顺序是这样: 每次执行栈的同步任务执行完毕,就会去任务队列中取出完成的异步任务,队列中

$nextTick 宏任务微任务 macrotasks microtasks

1.nextTick调用方法首先看nextTick的调用方法: https://cn.vuejs.org/v2/api/#Vue-nextTick // 修改数据 vm.msg = 'Hello' // DOM 还没有更新 Vue.nextTick(function () { // DOM 更新了 }) // 作为一个 Promise 使用 (2.1.0 起新增,详见接下来的提示) Vue.nextTick() .then(function () { // DOM 更新了 }) 即:既可以支持

总结：JavaScript异步、事件循环与消息队列、微任务与宏任务

本人正在努力学习前端,内容仅供参考.由于各种原因(不喜欢博客园的UI),大家可以移步我的github阅读体验更佳:传送门,喜欢就点个star咯,或者我的博客:https://blog.tangzhengwei.me 掘金:传送门,segmentfault:传送门前言 Philip Roberts 在演讲 great talk at JSConf on the event loop 中说:要是用一句话来形容 JavaScript,我可能会这样: "JavaScript 是单线程.异步.非阻塞.解