【宏任务和微任务的理解】

一、JS为什么要区分宏任务和微任务

（1） js是单线程的，但是分同步异步

（2） 微任务和宏任务皆为异步任务，它们都属于一个队列

（3） 宏任务一般是：script，setTimeout，setlnterval，postMessage，MessageChannel，

   setlmmediate（Node.js  环境）

（4） 先执行同步再执行异步，异步遇到微任务，先执行微任务，执行完后如果没有微任务，

  就执行下一个宏任务，如果有微任务，就按顺序一个一个执行微任务

二、宏任务，微任务有那些？

   宏任务一般是：script，setTimeout，setlnterval，postMessage，MessageChannel，
setImmediate（Node.js  环境）

   微任务：Promise.then，Object.observe，Mutation Observer，process.nextTick(Node.js  环境）

三、宏任务、微任务是怎么执行的？

执行顺序：先执行同步代码，遇到异步宏任务则将异步宏任务放入宏任务队列中，遇到异步微任务则将异步微任务放入微任务队列中，当所有同步代码执行完毕后，再将异步微任务从队列中掉入主线程执行，微任务执行完毕后再将异步宏任务从队列中调入主线程执行，一直循环直至所有任务执行完毕。

这里容易有一个错误的认识：就是微任务先于宏任务执行。实际上是先执行同步任务然后在执行异步任务，异步任务是分宏任务和微任务两种的。

案例

setTimeout(function(){
console.log(1)
});

new Promise(function(resolve){

   console.log(2);

   resolve();

}).then(function(){

  console.log(3);

}).then(function(){

  console.log(4)

});

console.log(5);

分析：

遇到setTimout，异步宏任务，放入宏任务队列中

遇到new Promise，new Promise在实列化对象的过程中执行的代码都是同步进行的，所以输出2

Promise.then，异步微任务，将其放入微任务队列中

遇到同步任务console.log(5);输出5；主线程中同步任务执行完

从微任务队列中取出任务到主线程中，输出3、4，微任务队列为空

从宏任务队列中取出任务到主线程中，输出1，宏任务队列为空

---

总结

微任务和宏任务的执行顺序是先执行同步任务，先执行同步后异步，异步分为宏任务和微任务两种，异步遇到微任务先执行微任务，执行完后如果没有微任务，就执行下一个宏任务。