[学习笔记]微任务和宏任务的输出顺序

本来标题是 ‘[学习笔记] Promise, async/await, setTimeout的输出顺序’, 结果因为限制长度太长就改成现在这个标题…

1. 事件循环, 微任务，宏任务

要弄清楚 Promise,async/await, setTimeout() 这三者函数体内的输出顺序, 首先要了解他们在事件循环中扮演的角色

异步任务:

• 微任务: Promise(), async/await
• 宏任务: setTimeout(), setInterval(), Ajax请求, DOM事件

事件循环简要流程:
(注: 微任务是ES6规定的, 为了执行微任务, ES6再专门规定一个micro task queue来执行微任务, 而宏任务是浏览器规定的, 放进Callback queue)

1. 执行同步代码，一行一行放进Call stack里面执行
2. 遇到异步任务先"记录",
3. 当Call stack里面的同步任务执行完之后，在"记录"下来的异步任务里面寻找微任务
4. 将微任务 (Promise, async/await) 放进 micro task queue 中, 然后push进Call stack执行
5. 当微任务执行完毕后，尝试进行DOM渲染
6. 最后触发事件循环机制，将异步任务里面的宏任务调出放进Callback queue
7. 按顺序push进Call stack 执行代码

2. Promise() ,async/await, setTimeout() 的输出顺序

了解完事件循环过程后, 来看Promise() ,async/await, setTimeout() 的输出顺序：
**数字代表输出顺序

//注意：即使async/await是异步任务的微任务（按照事件循环机制，同步代