js中的宏任务与微任务

js中的宏任务与微任务 (只在浏览器中支持的，不包括node)

宏任务里面放的有 :
setTimeout 定时器
setInterval 计时器
requestAnimationFrame web中写动画的另一种方式

微任务里面放的有：
promise.then catch finally Promise里面的方法（这里不包括new Promise）
MutationObserver 监视DOM发生改变

先来一个小例子   
setTimeout(() => {    //执行后 回调一个宏事件            
    console.log('1')
}, 0)
console.log('2');
new Promise((resolve) => {
    console.log('3');
    resolve()
}).then(() => {
    console.log('4');
}).then(()=>{
    console.log('5')
})

1.只要遇到宏任务（setTimeout），我们直接把他放到最后执行。
2.开始执行外边的主线程console.log()。
3.遇到微任务（Promise）（new Promise）直接执行。.then被分配到Event Queue中
4.第一轮执行 ，打印了  2   3   4   5。
5.第二轮开始执行宏任务里面的   打印了 1。

宏任务与微任务之间的关系

1.先在代码中看看有没有微任务，执行完全部微任务。
2.在执行一个宏任务，看看里面有没有微任务执行完里面的微任务，在执行里面的宏任务。
3.当前宏任务里面的内容执行完后，在执行下一个宏任务。

在来一个例子                   
setTimeout(function() {
    console.log('1');
    new Promise(function(resolve) {
        console.log('2');
        resolve();
    }).then(function() {
        console.log('3')
    })
})
new Promise(function(resolve) {
    console.log('4');
    resolve();
}).then(function() {
    console.log('5')
})
console.log('6');
setTimeout(function() {
    console.log('7');
    new Promise(function(resolve) {
        console.log('8');
        resolve();
    }).then(function() {
        console.log('9')
    })
})

     答案：4  6   5   1   2   3   7    8    9

    1.new Promise不是微任务，里面的方法是微任务。所以执行new Promise     打印出来 4
    2.然后console.log   打印   6
    3.然后执行微任务  Promise里面的方法  打印出来  5
    4.开始执行第一个宏任务， 先console.log  打印1  在继续打印  2  和   3
    5.执行完里面的全部任务，在执行下一个宏任务，继续打印 7   8   9