1、Javascript语言的执行环境是”单线程”，指的是一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推。
2、这种模式的好处是实现起来比较简单，执行环境相对单纯；坏处是只要有一个任务耗时很长，后面的任务都必须排队等着，会拖延整个程序的执行。常见的浏览器无响应（假死），往往就是因为某一段Javascript代码长时间运行（比如死循环），导致整个页面卡在这个地方，其他任务无法执行。
3、为了解决这个问题，Javascript语言将任务的执行模式分成两种：同步（Synchronous）和异步（Asynchronous）
“同步模式” 就是上一段的模式，后一个任务等待前一个任务结束，然后再执行，程序的执行顺序与任务的排列顺序是一致的、同步的；”异步模式”则完全不同，每一个任务有一个或多个回调函数（callback），前一个任务结束后，不是执行后一个任务，而是执行回调函数，后一个任务则是不等前一个任务结束就执行，所以程序的执行顺序与任务的排列顺序是不一致的、异步的。
“异步模式” 非常重要。在浏览器端，耗时很长的操作都应该异步执行，避免浏览器失去响应，最好的例子就是Ajax操作。在服务器端，”异步模式”甚至是唯一的模式，因为执行环境是单线程的，如果允许同步执行所有http请求，服务器性能会急剧下降，很快就会失去响应。
处理异步的几种方法
一、回调函数（callback）
二、事件监听
先从事件绑定说起，在JavaScript中，有三种常用的绑定事件的方法：
- 在DOM元素中直接绑定；
<input type="button" value="click me" onclick="hello()"- 在JavaScript代码中绑定；
document.getElementById("btn").onclick = function(){
alert("hello world!");
}- 绑定事件监听函数。
绑定事件的另一种方法是用 addEventListener() 或 attachEvent() 来绑定事件监听函数。
W3C规范：
document.getElementById("btn1").addEventListener("click",hello);
function hello(){
alert("hello world!");
}
IE规范：
document.getElementById("btn1").attachEvent("click",hello);
function hello(){
alert("hello world!");
}
事件监听的优点：
1、可以绑定多个事件。常规的事件绑定只执行最后绑定的事件。
var btn3 = document.getElementById("btn3");
btn3.onclick = function(){
alert("hello 1"); //不执行
}
btn3.onclick = function(){
alert("hello 2"); //执行
}而事件监听的话两个事件都执行。
btn4.addEventListener("click",hello1);
btn4.addEventListener("click",hello2);
function hello1(){
alert("hello 1");
}
function hello2(){
alert("hello 2");
2、可以解除相应的绑定
btn5.addEventListener("click",hello1);//执行了
btn5.addEventListener("click",hello2);//不执行
btn5.removeEventListener("click",hello2);
function hello1(){
alert("hello 1");
}
function hello2(){
alert("hello 2");
}
封装监听事件
<input type="button" value="click me" id="btn5">
//绑定监听事件
function addEventHandler(target,type,fn){
if(target.addEventListener){
target.addEventListener(type,fn);
}else{
target.attachEvent("on"+type,fn);
}
}
//移除监听事件
function removeEventHandler(target,type,fn){
if(target.removeEventListener){
target.removeEventListener(type,fn);
}else{
target.detachEvent("on"+type,fn);
}
}
//测试
var btn5 = document.getElementById("btn5");
addEventHandler(btn5,"click",hello1);//添加事件hello1
addEventHandler(btn5,"click",hello2);//添加事件hello2
removeEventHandler(btn5,"click",hello1);//移除事件hello1三、发布/订阅
四、promise对象（promise 模式）
五、ES 7中的async和await
