同步和异步

JavaScript语言的执行环境是”单线程”（single thread）。
所谓”单线程”，就是指一次只能完成一件任务。
如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推。

这种模式的好处是实现起来比较简单，执行环境相对单纯；
坏处是只要有一个任务耗时很长，后面的任务都必须排队等着，会拖延整个程序的执行。
常见的浏览器无响应（假死），往往就是因为某一段Javascript代码长时间运行（比如死循环），
导致整个页面卡在这个地方，其他任务无法执行。

为了解决这个问题，Javascript语言将任务的执行模式分成两种：同步（Synchronous）和异步（Asynchronous）。

同步模式

1 2	同步模式：就是后一个任务等待前一个任务结束，然后再执行，程序的执行顺序与任务的排列顺序是一致的、同步的；

example

1	<script src="./script.js"></script>

同步模式，即阻塞模式，会阻止浏览器的后续处理，停止了后续的解析，因此停止了后续的文件加载（如图像）、渲染、代码执行。
js 之所以要同步执行，是因为js中可能有输出document内容、修改dom、重定向等行为，所以默认同步执行才是安全的。
一般建议是把<script>放在页面末尾</body>之前，这样尽可能减少这种阻塞行为，而先让页面展示出来。

异步模式

1
2
3

异步模式：每一个任务有一个或多个回调函数（callback），前一个任务结束后，不是执
行后一个任务，而是执行回调函数，后一个任务则是不等前一个任务结束就执行，所以程序的
执行顺序与任务的排列顺序是不一致的、异步的。

异步模式又叫非阻塞。在web端，耗时很长的操作都应该异步执行，避免浏览器失去响应，最好的例子
就是Ajax操作。在js写server中，异步模式甚至是唯一的模式，因为执行环境是单线程的，如果允许同步执行所有http请求，服务器性能会急剧下降，很快就会失去响应。

异步调用并不会阻止代码的顺序执行，而是在将来的某一个时刻触发设置好的逻辑，所以我们
并不知道逻辑什么时候会被调用
只能定义当触发的时候逻辑是什么
只能等待，同时可以去处理其他的逻辑
异步函数，如setTimeout和setInterval，是被压入了称之为Event Loop的队列。
Event Loop是一个回调函数队列。当异步函数执行时，回调函数会被压入这个队列。JavaScript引擎
直到异步函数执行完成后，才会开始处理事件循环。这意味着JavaScript代码不是多线程的，即使表现
的行为相似。事件循环是一个先进先出（FIFO）队列，这说明回调是按照它们被加入队列的顺序执行的。
JavaScript被node选做为开发语言，就是因为写这样的代码多么简单啊。

example

1	<script src="./script.js" async></script>

浏览器在下载执行 js 同时，还会继续进行后续页面的处理。
这种方法是在页面中<script>标签内，设置async属性，async属性是HTML5中新增的异步支持。

but这种加载方式在加载执行完之前会阻止 onload 事件的触发，而现在很多页面的代码都在 onload 时还要执行额外的渲染工作等，所以还是会阻塞部分页面的初始化处理。

ps不管是同步加载还是异步加载,浏览器在下载完 js 的内容后就会立即对其解析和执行。
异步加载，解决的只是下载阶段的问题，但代码在下载后会立即执行。
浏览器在解析执行 JS 阶段是阻塞任何操作的，这时的浏览器处于无响应状态。
下载 script 需要明显的时间，但容易忽略了第二阶段，解析和执行也是需要时间的。script的解析和执行所花的时间比我们想象的要多，尤其是script 很多很大的时候。有些是需要立刻执行，而有些则不需要（比如只是在展示某个界面或执行某个操作时才需要）。*注：如何在第一次需要的时候再执行。感兴趣的可以看看ControlJS *

处理异步代码

callback

这种异步的方式是最基础的实现:

 fs.readFile(fileA, function (err, data) {
  fs.readFile(fileB, function (err, data) {
    // ...
  });
});

如果涉及到多个这样的异步操作，会有复杂的回调嵌套，就是传说中的回调地狱。

避免这种回调地狱

命名函数

1 2	清除嵌套回调的一个便捷的解决方案是简单的避免双层以上的嵌套。传递一个命名函数给作为回调参数，而不是传递匿名函数。