eventloop机制 和 JavaScript 运行机制详解
一、为什么Javascript是单线程
js这门语言的一大特点就是，它是单线程的。意思就是一个时间只能做一件事。下面就介绍一下为啥，js这样设计的原因。
js之所以是单线程，和它本身的用途有关。作为浏览器脚本语言，js的主要用途是与用户互动，以及操作DOM。假如js不是一个单线程，那么当我们在操作DOM的时候，其中一个线程在修改DOM节点，另一个线程在删除这个DOM节点，那么浏览器要把以哪一个线程为主呢。
所以，为了避免复杂性，js从一诞生就是单线程，也是js这门语言的核心
为了利用多核CPU的计算能力，HTML5提出了Web Worker标准，允许js脚本创建多个线程，但子线程完全受主线程控制，且不能操作DOM。所以这次标准本质上并没有改变js单线程的本质。
二、任务队列
单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。如果前一个任务耗时很长，后一个任务就不得不一直等着。
在一些场景下，CPU处于很闲的状态，但因为IO设备很慢(比如Ajax操作是从网络读取数据)，而导致了后面的任务必须要等结果出来了才能继续往下执行
于是JavaScript语言的设计者意识到，在这个时候的主线程完全可以先不管IO设备，挂起处于等待中的任务，先运行后面的任务。等到IO设备返回了结果，再回头，把挂起的任务继续执行下去。
于是，所有任务分成两种同步任务(synchronous) 和 异步任务(asynchronous)。
同步任务:
在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务
异步任务:
不进入主线程，而进入任务队列(task queue)的任务，只有任务队列通知主线程，某个异步任务可以执行了，该任务才会进入主线程执行。
具体来说异步执行的运行机制如下:
- 所有同步任务都在主线程中执行，形成一个执行栈（execution context stack）
- 主线程之外，还存在一个任务队列（task queue）。只有异步任务有了运行结果，就在任务队列中放置一个事件
- 一旦执行栈中的所有同步任务执行完毕，系统就会读取任务队列看看里面有哪些事件。那些对应的异步任务就会结束等待状态，进入到执行栈，开始执行。
- 主线程不断的重复上面三步
只要主线程空了，就回去读取任务队列,这就是js的运行机制。这个过程会不断重复
任务队列
任务队列就是一个事件的队列，IO设备完成一项任务，就会在任务队列中添加一个事件，表示相关的异步任务可以进入执行栈了。主线程读取任务队列，就是读取里面有哪些事件
任务队列里面的事件，除了有IO设备的事件以外，还包括一些用户的事件(鼠标点击，滑动滚轮等等)。只要指定过回调函数，这些事件发送的时候就会进入任务队列，等待主线程读取
任务队列是一个先进先出的数据结构，排在前面的事件会优先被主线程读取。
而且主线程的读取是自动的，只要执行栈为空，任务队列上的第一个事件就会自动进入主线程，同时也会检查一下事件的执行时间，因为有可能规定了到时间才能执行(也就是定时器)
回调函数
回调函数就是那些会被主线程挂起来的代码。异步任务必须指定回调函数，当主线程开始执行异步任务，就是执行对应的回调函数
Event Loop
主线程不断循环的从任务队列中读取事件的这个过程，又称为Event Loop(事件循环)
下面这个图是转自阮一峰文章的：
image
上图中，主线程运行时，产生堆(heap) 和 栈(stack),栈中的代码调用各种外部API，它们在任务队列中加入了各种事件(click,ajax,done)。只要栈中的代码执行完毕，主线程就会去读取任务队列，依次执行那些事件所对应的回调函数。
执行栈中的代码（同步任务），总是在读取"任务队列"（异步任务）之前执行
网友评论