- A+
所属分类：Web前端
微任务有哪些
Promise await和async 宏任务有哪些
setTimeout setInterval DOM事件 AJAX请求 看下面的代码
<script> console.log(1) setTimeout(()=>{ console.log("2") },0) Promise.resolve().then(()=>{ console.log('3') }) console.log(4) </script> 我们发现打印的顺序是1-4-3-2 为什么是这样的顺序 先打印1-4这肯定是没有问题的 为啥先打印3然后才是2 因为3是Promise,Promise是微任务。 2是setTimeout，它是宏任务 微任务的执行时机比宏任务早。 所以先执行的是3然后才是2 
我的结论
先同步后异步，先微后宏 微任务的执行时机比宏任务早哈~ 说说下面代码的执行时机
<body> <div id="app"></div> <script> // 这一段是dom渲染的 let app=document.getElementById("app") let cont='<p>我是p标签</p>' app.append(cont) // dom渲染结束 console.log(1) setTimeout(()=>{ console.log("2") alert('setTimeout2') },0) Promise.resolve().then(()=>{ console.log('3') alert('3') }) console.log(4) </script> </body> 上面这一段代码的执行分析
肯定是先执行1-4 然后根据先微任务后宏任务 就是输出3然后弹出3 然后就是说输出2然后弹出setTimeout2 【错误的】 因为微任务和宏任务之间还有一个DOM渲染 所以然后是dom渲染，最后才是宏任务 所以输出1-4后，执行的是DOM渲染。 然后才是输出2然后弹出setTimeout2 结论和运用的场景
微任务》DOM渲染》宏任务 看下面的例子 这个结论的运用场景 我们都做过echarts.我们知道渲染echarts的时候。 需要页面的DOM渲染完毕后，才能拿到节点进行渲染。 所以有的小伙伴会请请求的时机放在monuted()这个生命周期中 这样就可以确保返回来的数据肯定能够正常渲染在页面上。 其实根据上面这个结论。 你完全可以在created中去请求数据。返回来的的时候。 DOM肯定渲染完了。因为请求是宏任务。 宏任务的执行时机是在DOM渲染后的哈 
求求你了看官
如果你觉得我写的还不错的话~~ 请你给我点个一个推荐或者关注我！！ 或者请我买一包辣条谢谢你了~~~ 
