这里只是个人的理解，用于理解+笔记，记录对异步的粗糙理解。

--写在前面

异步的情景：

一：异步的出现场景可分为以下

1. Ajax请求数据时

2. 定时器

3. 一些点击事件（这里暂时了解的不是特清楚）

二：注意点

1. 为什么会需要异步？

2. 异步的原理是怎么样的？

3. 当多个异步同时出现，他的执行顺序是怎么样的？

为什么会需要异步？

由于 js是单线程的语言 ，这样对于也就注定了他不能像其他语言一样 同一时间内同时 执行多个任务，所谓“单线程”就是一根筋，对于拿到的程序，一行一行的执行，直到执行为完成，中间如果有 卡顿，延迟都会一直等待，别的事都不做。

var i, t = Date.now()
for (i = 0; i < 100000000; i++) {}
console.log(Date.now() - t)  // 250 （chrome浏览器）

上面这种执行时没问题的，但是js用在游览器客户端，可能会有大量的网络请求，而一个网络资源啥时候返回，这个时间是不可预估的，

对于这种场景 js就设计了异步 => 即 发送一个请求，就先不管了，先干其他事情，请求啥时候返回结果，到时候再说，这样就能保证一个网页的流程运行。（JavaScript 内部采用的“事件循环”机制）

异步的原理是怎么样的？

var ajax = $.ajax({url: '/data/data1.json',success: function () {console.log('success')}
})

Ajax中传入2个参数，这里介绍第二个参数，success是一个函数，这个函数传过去，并不会立即执行，而是等着请求成功之后才能执行，这里称之为 回调函数

简单介绍些 回调函数：

回调什么时候执行？

同步里的回调： 一般在同步情境下是最后执行的。

异步里的回调： 而在异步情境下有可能不执行，因为事件没有被触发或者条件不满足。

如果执行那么会 当有结果返回 再进行执行

• 简单理解所谓“回调函数”就是那些被主线程挂起来的代码，（异步必须指定回调，同步的不是挂起）

使用场景：如果动态的加载js文件 Ajax请求等都可能会用到

回调就暂时说道这里。。。

So. 可以看出异步的核心在于：就是将callback作为参数传递给异步执行函数，当有结果返回之后再触发 callback执行

好了我们现在继续来说异步：

之前说过js是单线程，意味着需要排队执行，这样如果计算量特大，cpu可能忙不过来，JavaScript语言的设计者意识到，主线程完全可以不管 IO（阻塞），挂起处于处于等待中的任务，先运行排在后面的任务，等到这个 IO（阻塞）返回了结果，再回过头来，把挂起的任务继续执行下去。（说明js不存在同时进行的任务，单线程原理（webWork除外））

于是任务可以分为两种，一种是同步任务，另一种是异步任务。

• 同步任务指的是，在主线程上执行的任务，只有前一个任务执行完，才能执行后一个任务；
• 异步任务指的是，不进入主线程，而进入“任务队列”的任务，只有“任务队列”通知主线程，某个异步任务可以执行了，该任务才会进入主线程执行；

具体来说，异步执行的运行机制：

（1）所有同步任务都在主线程上执行，形成一个执行栈（execution context stack）。
（2）主线程之外，还存在一个"任务队列"（task queue）。只要异步任务有了运行结果，就在"任务队列"之中放置一个事件。
（3）一旦"执行栈"中的所有同步任务执行完毕，系统就会读取"任务队列"，看看里面有哪些事件。那些对应的异步任务，于是结束等待状态，进入执行栈，开始执行。
（4）主线程不断重复上面的第三步。

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

注意：

• "任务队列"是一个先进先出的数据结构，排在前面的事件，优先被主线程读取。主线程的读取过程基本是自动的，只要主线程 执行栈一清空，“任务队列”上第一位的任务就自动进入主线程，但是这里要说说定时器，主线程首先要检查一下执行时间，因为定时器中二个参数并不是真正等待开始执行时间，在这个时间之前可能存在大量的IO导致定时器中回调 不能正常的进入主线程执行

当多个异步同时出现，他的执行顺序是怎么样的？

个人理解还是同 异步自己返回结果的时间做比较，因为这个时间本省就是不可预估的；
扩充：异步的js 中存在 点击事件，网络请求， 定时器这几种，
点击事件，我们暂时不讨论，因为其本身就很快（几百毫秒，不考虑多个鼠标同时点击。这也只是线程抢占的快慢问题）
网络请求，和定时器是一个道理，网络请求调用的是同步代码，但是异步的逻辑在于请求有返回结果；请求的时长决定了回调函数何时进入事件队列中去，和定时器第二个参数类似;

As：

(function(){setTimeout(fuction(){console.log("aa")},3000);setTimeout(fuction(){console.log("bb")},1000);// bb aa
})();// 严格来说 setTimeout(...0) 并不直接把项目插入到事件循环队列。定时器会在有机会的时候插入事件。像这种两个连续的 setTimeout(...0) 调用不能// 保证会严格按照调用顺序处理，所以各种情况都有可能出现，比如定时器漂移(function(){$.ajax(function(){console.log("aa")});setTimeout(fuction(){console.log("bb")},1000);// 这里的就要要看具体的 Ajax返回时间了，   //如果希望定时器,在请求之后执行，可以将其写在成功后的回调里面。
})();

在写之前也是参考了一些文章，阮一峰写的确实挺好了大家可以参考下：

http://www.ruanyifeng.com/blog/2014/10/event-loop.html​www.ruanyifeng.com

重新修改： 关于对事件循环和任务队列的理解

详解事件循环与任务队列​www.jianshu.com