微任务宏任务

在js中， 有同步代码和异步代码，先执行同步的，后执行异步的。

由于这个事件轮询机制，当浏览器同时遇到同步和异步，并着先进先出，同步代码正常执行，而异步代码则会放进队列中，当同步执行完后，会去找队列中的异步代码执行。但是异步代码中又包括微任务和宏任务，他会先执行微任务在去执行宏任务。

常见的微任务：process.nextTick，promise的.then .catch async await

常见的宏任务：整个script模块，setTimeout,setInterval...

以下案例可供参考

案例1

process.nextTick(() => {console.log('111');});

const promise = new Promise(resolve => {
  console.log('222');
  resolve();
});

setTimeout(() => {console.log('333');}, 100);

promise.then(() => {console.log('444');});

案例2

Promise.resolve().then(() => {console.log('111');});

process.nextTick(() => {
  console.log('222');
})

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

console.log('444');

案例3

console.log('111')

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

new Promise((resolve) => {
    console.log('333')
    resolve()
})
.then(() => {
  console.log('444')
})
.then(() => {
  console.log('555')
})

console.log('666')

案例4

process.nextTick(() => {
  console.log('111');
});
setTimeout(() => {
  console.log('222');
}, 0);
const promise = Promise.resolve();
promise
  .then(() => {
    console.log('333');
    process.nextTick(() => {
      console.log('444');
    });
    setTimeout(() => {
      console.log('555');
    }, 0);
  })
  .catch(() => {
    console.log('666');
  })
  .catch(() => {
    console.log('777');
  })