JS中的事件循环

我们都知道，JS是一门单线程的编程语言，也就是说，js一次只能执行一次任务，多个任务只能一个一个的执行，当前面的任务执行完毕之后，才能够执行下一次任务。这也是js的执行机制，它并不能一次性处理多个任务，因此被称为单线程的编程语言。

但是，随着复杂业务的不断出现，简单的单线程就不能满足这些业务的实现，于是在HTML5时，就提出了web worker标准，允许js能同时创建多个线程，于是，在js中就有了同步和异步的概念。

同步

前一个任务执行完毕之后才能执行后一个任务，程序的执行顺序和任务的顺序是同步的。

异步

前一个任务执行时，它有可能比较耗时，因此可以在执行前一个任务执行期间，继续执行后面的任务，当后面的任务执行完毕再次回来执行这个任务。

它们本质的区别就是任务的执行顺序不同。

JS的执行机制

JS在执行代码时，会把所有的同步任务放到一个执行栈里面去，当遇到异步任务时，就会把异步任务放到异步任务队列中，下面是一些常见的异步任务：

1. 普通的事件回调函数
2. 定时器函数

下面以一段代码作为演示：

 console.log(111)
 console.log(222)
 setTimeout(function () {
   console.log(333)
  }, 0)
 console.log(444)

输出的结果为：

因为定时器函数属于异步任务，因此，浏览器把该函数放到了异步队列中，待所有的同步任务执行完毕之后，再次回到队列中查看是否存在待执行的任务，发现有一个，则执行放到执行栈中执行，执行完毕之后，再次查看，发现任务队列已经没有其他待执行的任务，即可结束，这个流程称之为事件循环（event loop） 

 console.log(1)
 document.addEventListener('click', function () {
  console.log(2)
 })
 console.log(3)
 setTimeout(() => {
   console.log(4)
 }, 0)