这篇文章准备了两天都不知道如何入手，我看了很多资料，我自己是弄明白了，输入和输出真的是两回事，万事开头难。但是做难的事才会有收获，才会成长！ 我很喜欢功夫熊猫里面有一句台词，附图！

什么是事件循环？

Javascript是一门单线程的语言，同一时刻只能做一件事，但是接口请求，定时器都是需要等待，如果没有其它机制，让JS按顺序执行任务，JS线程会被阻塞，为了让这些异步的任务不阻塞JS线程的执行，浏览器提供了事件循环的机制，来实现异步事件的回调。

事件队列 （Task Queue）

在事件循环的时候，运行时会从最先进入队列的消息开始处理队列中的消息。被处理的消息会被移出队列，并作为输入参数来调用与之关联的函数。

宏任务和微任务

宏任务(macro-task)：

• 1.script整体代码
• 2.setTimeout()
• 3.setInterval()
• 4.I/O 操作（例如文件读写、HTTP请求等）
• 5.UI 渲染
• 6.setImmediate()（仅在 Node.js 环境下）

微任务(micro-task)：

• 1.Promise 的 then() 、catch()、finally()方法
• 2.async/await (返回的就是一个Promise)
• 3.process.nextTick()（仅在 Node.js 环境下）
• 4.MutationObserver（仅在浏览器环境下）

调用栈（call stack）

也叫执行栈，是 JavaScript 运行时用于存储函数调用的数据结构(栈先进后出)，它记录了当前执行的上下文（context）和函数调用链。

执行步骤

• 1.先执行同步代码，所有同步代码都在主线程上执行，形成一个执行栈。
• 2.当遇到异步任务时，会将其挂起并添加到任务队列中，宏任务放入宏任务队列，微任务放进当前执行栈的后面。
• 3.当执行栈为空时，事件循环从任务队列中取出可执行的任务，加入到执行栈中执行。
• 4.重复上述步骤，直到任务队列为空