宏任务和微任务

Posted Smile沛沛

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了宏任务和微任务相关的知识,希望对你有一定的参考价值。

宏任务和微任务

js是单线程的,所以我们可以称之为主线程,也就是我们的js代码都是在主线程上完成的。祝不过我们区分任务是同步还是异步,如果是异步的话,那么它会有一个回调函数。 回调函数:定时器的回调、ajax请求的回调、对应事件的回调(比如点击事件)。不同的任务又会交给不同的模块去处理,比如:定时器模块、网络请求模块、事件处理模块。

js事件轮询机制,js是单线程的

  • 宏任务:setTimeout 、setInterval、requestAnimationFrame
    • 宏任务所处的队列就是宏任务队列
    • 第一个宏任务队列中只有一个任务、执主线程的js代码
    • 宏任务队列可以哟欧多个
  • 微任务:New Promise().then(两个回调函数 )、process.nextTick
    • 微任务所处的队列就是微任务队列
    • 只有一个微任务队列
    • 上一个宏任务执行完成之后如果有微任务就会执行微任务队列中所有任务
    • 当宏任务重的任务执行完成之后会此案去查看微任务队列中是否有任务,如果有就先执行微任务队列中的任务,如果没有的话就继续执行下一个宏任务
//主线程宏任务执行打印1-5  微任务队列执行打印then中console   setTimeout宏任务执行

console.log('start')

setTimeout(()=>{
  console.log('setTimeout')
},0)

new Promise((resolve,reject)=>{
  for(var i = 0;i<=5;i++){
    console.log(i)
    resolve()
  }
}).then(()=>{
  console.log('promise实例成功回调')
})

console.log('end')

//输出:
// start 1 2 3 4 5 end promise实例成功回调  setTimeout

以上是关于宏任务和微任务的主要内容,如果未能解决你的问题,请参考以下文章

宏任务和微任务的一个小事

宏任务和微任务

宏任务和微任务

js 事件循环消息队列和微任务宏任务

click 事件中的宏任务和微任务

click 事件中的宏任务和微任务