javascript中的异步执行顺序

最近浏览资料的过程中重新了解了些JavaScript中异步的知识,对这块知识有了更多的认识,于是整理下加深自己对于这部分内容的理解。

树立认知

JavaScript引擎是常驻于内存中的,这也是为什么JavaScript中对dom进行事件绑定可以生效的原因,当dom节点遇到触发事件的条件,引擎会自动找寻回调函数代码去执行,并且引擎还会设定指定时间去执行代码,类似set time out函数这种功能代码。

宏观任务与微观任务

es5之后js中引入了promise的概念,这让js引擎也可以发起任务,我门将宿主环境发起的任务称为宏观任务,将js引擎发起的任务称为微观任务(promise发起的),这里提一句set time out发起的是宏观任务,他是宿主引擎中的API

这里要注意的一点是每个宏观任务一定会保证在这个宏观任务中发起的微观任务完成才会执行其他宏观任务

实例

下边来个实例来具体分析看看js中异步执行的规律。

setTimeout(()=> console.log('a'),0);
var r1= new Promise((resolve,reject)=> {
  resolve()
}).then(()=>{
  var begin = Date.now();
  while(Date.now()-begin<1000){
  }
  console.log('c1');
  new Promise((resolve,reject)=>{
    resolve()
  }).then(()=>{
    console.log('c2')
  })
})
// c1
// c2
// a

上边例子中,宏观任务中执行了一个setTimeout、执行了一个promise(发起了一个微观任务),在微观任务中延迟了一秒后又建立了一个promise(又一次发起了一个微观任务)。

根据先宏观任务后微观任务的规则,就可以很容易的明白最终的打印结果。

分析异步执行顺序

  • 确定多少宏观任务

  • 确定每个宏观任务中有多少微观任务

  • 确定每个宏观任务中微观任务执行顺序

  • 确定每个宏观任务执行顺序

  • 确定整个执行顺序

你可能感兴趣的:(javascript中的异步执行顺序)