1. 概念

**#1.1 单线程、同步、异步**

JS是单线程,单线程即任务是串行的,后一个任务需要等待前一个任务的执行,这就可能出现长时间的等待。但由于类似ajax网络请求、setTimeout时间延迟、DOM事件的用户交互等,这些任务并不消耗 CPU,是一种空等,资源浪费,因此出现了异步。通过将任务交给相应的异步模块去处理,主线程的效率大大提升,可以并行的去处理其他的操作。当异步处理完成,主线程空闲时,主线程读取相应的callback,进行后续的操作,最大程度的利用CPU。

此时出现了同步执行和异步执行的概念,同步执行是主线程按照顺序,CPU串行执行任务(通过执行栈,先进后出);异步执行就是跳过等待,先处理后续的同步任务(不是说异步不执行了,而是交给网络模块、timer等并行进行任务)。由此产生了事件循环与任务队列(ES6新增),来协调主线程与异步模块之间的工作。

**#1.2 引擎和runtime**

在具体执行层,是依赖js引擎宿主环境runtime来实现event loop机制。

注意,通常是宿主环境提供事件循环机制来处理程序中多个块的执行,执行时调用JavaScript引擎。换句话说,JS引擎本身没有时间的概念,只是一个按需执行js任意代码片段的环境。“事件”(JavaScript代码执行)调度总是由包含它的环境进行。

举个例子,如果JavaScript程序发出一个Ajax请求(从服务器获取一些数据),通常会在一个函数中(通常称为回调函数)设置好响应代码,然后JavaScript引擎会通知宿主环境:“嘿,现在我要暂停执行,你一旦完成网络请求拿到数据,请调用这个函数。”然后浏览器(宿主环境)拿到数据后,就会把回调函数插入到事件循环中。

**#1.3 执行栈**

当javascript代码执行的时候会将不同的变量存于内存中的不同位置:堆(heap)和栈(stack)中来加以区分。其中,堆里存放着一些对象。而栈中则存放着一些基础类型变量以及对象的指针。 但是我们这里说的执行栈和上面这个栈的意义却有些不同。

当我们调用一个方法的时候,js会生成一个与这个方法对应的执行环境(context),又叫执行上下文。这个执行环境中存在着这个方法的私有作用域,上层作用域的指向,方法的参数,这个作用域中定义的变量以及这个作用域的this对象。 而当一系列方法被依次调用的时候,因为js是单线程的,同一时间只能执行一个方法,于是这些方法被排队在一个单独的地方。这个地方被称为执行栈

当一个脚本第一次执行的时候,js引擎会解析这段代码,并将其中的同步代码按照执行顺序加入执行栈中,然后从头开始执行。如果当前执行的是一个方法,那么js会向执行栈中添加这个方法的执行环境,然后进入这个执行环境继续执行其中的代码。当这个执行环境中的代码 执行完毕并返回结果后,js会退出这个执行环境并把这个执行环境销毁,回到上一个方法的执行环境。这个过程反复进行,直到执行栈中的代码全部执行完毕。

**#2. 事件循环**

**#Event Loop定义**

网络上许多文章关于event loop定义不是很清晰,我们直接看官方规范标准。再次强调事件循环机制是由宿主决定,Web宿主规范标准定义在HTML Standand (opens new window)中,NodeJS宿主规范标准定义在libuv (opens new window)

简单理解为:

  1. 所有同步任务都在主线程上执行,形成一个执行栈
  2. 主线程之外,还存在一个"事件队列"。只要异步操作执行完成,就到事件队列中排队。