宏任务和微任务解析

JS的特点

JavaScript 语言的一大特点就是单线程，也就是说，同一个时间只能做一件事。

宏任务：

        setTimeout setInterval Ajax DOM事件  script(整体代码)  

微任务： 

         Promise async/await  Object.observe MutationObserver     

同步和异步的区别:

        同步会阻塞程序的执行

        异步不会阻塞程序的执行

        正常在script写的代码是同步代码，宏任务和微任务都是异步代码

注意点：

    Promise是微任务是异步代码？？         是又不是

    Promise是本身同步代码，但是Promise的回调 .then和 .catch是异步代码 

这一点要特别注意

宏任务和微任务执行顺序

        微任务执行的时候比宏任务早，当所有的微任务执行完毕后会去执行宏任务，当宏任务内，所有的微任务执行完毕，会执行下一个宏任务，直到没有可执行的语句。术语--event loop（事件循环）

任务队列和event loop（事件循环）

        1）所有的同步任务都在主线程上执行，行成一个执行栈。

        2）除了主线程之外，还存在一个任务列队，只要异步任务有了运行结果，就在任务列队中植入一个时间标记。

        3）主线程完成所有任务(执行栈清空），就会读取任务列队，先执行微任务队列在执行宏任务队列。

        4）重复上面三步。

        只要主线程空了，就会读取任务列队，这就是js的运行机制，也被称为 event loop（事件循环）。

异步和单线程

        异步和单线程是相辅相成的，js是一门单线程脚本语言，所以需要异步来辅助

前端使用异步的场景：
定时任务：
        setTimeout，setInverval

网络请求：
        ajax请求，axios请求，动态<img>加载，事件绑定

考察的是事件循环和回调队列。注意以下几点：

        Promise 优先于 setTimeout 宏任务，所以 setTimeout 回调会最后执行

        Promise 一旦被定义就会立即执行

        Promise 的 resolve 和 reject  是异步执行的回调。所以 resolve() 会被放到回调队列中，在主函数执行完和 setTimeout 之前调用

        await 执行完后，会让出线程。async 标记的函数会返回一个 Promise 对象

事件循环图：

        为了让大家更加清晰的去理解事件循环，宏任务微任务执行，我下面给大家找了一张图