JavaScript与生俱来的特性---异步与回调

线程是建立在进程的基础上的一次程序运行单位，一个进程中可以有多个线程。

js单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。

如果前一个任务耗时很长，后一个任务就不得不一直等着。

 如果是因为计算量大，CPU忙不过来，倒也合乎逻辑，但是很多时候CPU是闲置着的，因为IO设备很慢（比如Ajax操作从网络读取数据），于是只能等着结果出来，再执行下面的程序。

JavaScript语言的设计者意识到，这时主线程可以不管IO设备，挂起处于等待中的任务，

先运行排在后面的任务。等到IO设备返回了结果，再回过头，把挂起的任务继续执行下去。

于是，所有任务可以分成两种，一种是同步任务（synchronous），另一种是异步任务（asynchronous）。

同步任务指的是，在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务；

异步任务指的是，不进入主线程、而进入”任务队列”（task queue）的任务，只有”任务队列”通知主线程，某个异步任务可以执行了，该任务才会进入主线程执行。

 

上图就是主线程和任务队列示意图

只要主线程空了，就会去读取”任务队列”，这就是JavaScript的运行机制。这个过程会不断重复。

异步执行的运行机制如下。（同步执行也是如此，因为它可以被视为没有异步任务的异步执行。） 

1. 所有同步任务都在主线程上执行，形成一个执行栈（execution context stack）。

2. 主线程之外，还存在一个"任务队列"（task queue）。只要异步任务有了运行结果，就在"任务队列"之中放置一个事件。

3. 一旦"执行栈"中的所有同步任务执行完毕，系统就会读取"任务队列"，看看里面有哪些事件。那些对应的异步任务，于是结束等待状态，进入执行栈，开始执行。

4. 主线程不断重复上面的第三步。

js引擎执行异步代码而不用等待，是因有为有 消息队列和事件循环。

消息队列：消息队列是一个先进先出的队列，它里面存放着各种消息。
事件循环：事件循环是指主线程重复从消息队列中取消息、执行的过程。

实际上，主线程只会做一件事情，就是从消息队列里面取消息、执行消息，再取消息、再执行。

当消息队列为空时，就会等待直到消息队列变成非空。而且主线程只有在将当前的消息执行完成后，才会去取下一个消息。这种机制就叫做事件循环机制，取一个消息并执行的过程叫做一次循环。 

事件循环用代码表示如下： 

while(true) {
    var message = queue.get();
    execute(message);
}

消息队列中放置的消息就是注册异步任务时添加的回调函数

以异步Ajax为例：

ajax('http://baidu.com', function(res) {
    console.log('我是响应：', res);
});

// 其他代码
...
...
...

主线程在发起AJAX请求后，会继续执行其他代码。

Ajax异步请求负责从baidu.com拿到返回的数据，当响应返回后，它会把响应封装成一个JavaScript对象，然后构造一条消息：

// 消息队列中的消息就长这个样子
var message = function () {
    callbackFn(response);
}

其中的callbackFn就是前面代码中得到成功响应时的回调函数。

主线程在执行完当前循环中的所有代码后，就会到消息队列取出这条消息(也就是message函数)，并执行它。

到此为止，就完成了工作线程对主线程的通知，回调函数也就得到了执行。

可以用下图来详细描述： 

 从上面分析可知：异步过程的回调函数，一定不在当前这一轮事件循环中执行。

为啥js是单线程？（一）