Javascript语言的执行环境是"单线程"（single thread，就是指一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推）。
为了解决这个问题，Javascript语言将任务的执行模式分成两种：同步（Synchronous）和异步（Asynchronous）。
“同步模式" 就是上一段的模式，后一个任务等待前一个任务结束，然后再执行，程序的执行顺序与任务的排列顺序是一致的、同步的；"异步模式"则完全不同，每一个任务有一个或多个回调函数（callback），前一个任务结束后，不是执行后一个任务，而是执行回调函数，后一个任务则是不等前一个任务结束就执行，所以程序的执行顺序与任务的排列顺序是不一致的、异步的。
“异步模式" 非常重要。在浏览器端，耗时很长的操作都应该异步执行，避免浏览器失去响应，最好的例子就是Ajax操作。在服务器端，"异步模式"甚至是唯一的模式，因为执行环境是单线程的，如果允许同步执行所有http请求，服务器性能会急剧下降，很快就会失去响应。
回调
回调是 JS 中最原始，也是最古老的异步通知机制。
function asyncFn(callback) {
// 利用setTimeout模拟异步
setTimeout(function () {
console.log('执行完毕');
callback(); // 发通知
}, 2000);
}
asyncFn(function () {
console.log('我会在2s后输出');
});事件监听
任务的执行不取决代码的顺序，而取决于某一个事件是否发生。
监听函数有：on，bind，listen，addEventListener，observe
还是以f1和f2为例。首先，为f1绑定一个事件（采用jquery写法）。
f1.on(‘done‘,f2);
上面代码意思是，当f1发生done事件，就执行f2。
发布订阅
promise
（1）promise对象是commonJS工作组提出的一种规范，一种模式，目的是为了异步编程提供统一接口。
（2）promise是一种模式，promise可以帮忙管理异步方式返回的代码。他讲代码进行封装并添加一个类似于事件处理的管理层。我们可以使用promise来注册代码，这些代码会在在promise成功或者失败后运行。
（3）promise完成之后，对应的代码也会执行。我们可以注册任意数量的函数再成功或者失败后运行，也可以在任何时候注册事件处理程序。
（4）promise有两种状态：1、等待（pending）；2、完成（settled）。
promise会一直处于等待状态，直到它所包装的异步调用返回/超时/结束。
（5）这时候promise状态变成完成。完成状态分成两类：1、解决（resolved）；2、拒绝（rejected）。
（6）promise解决（resolved）：意味着顺利结束。promise拒绝（rejected）意味着没有顺利结束。
//promise
var p=new Promise(function(resolved))
//在这里进行处理。也许可以使用ajax
setTimeout(function(){
var result=10*5;
if(result===50){
resolve(50);
}else{
reject(new Error('Bad Math'));
}
},1000);
});
p.then(function(result){
console.log('Resolve with a values of %d',result);
});
p.catch(function(){
console.error('Something went wrong');
});（1）代码的 关键在于setTimeout()的调用。
（2）重要的是，他调用了函数resolve()和reject()。resolve()函数告诉promise用户promise已解决；reject()函数告诉promise用户promise未能顺利完成。
（3）另外还有一些使用了promise代码。注意then和catch用法，可以将他们想象成onsucess和onfailure事件的处理程序。
（4）巧妙地方是，我们将promise处理与状态分离。也就是说，我们可以调用p.then（或者p.catch）多少次都可以，不管promise是什么状态。
（5）promise是ECMAscript 6管理异步代码的标准方式，javascript库使用promise管理ajax，动画，和其他典型的异步交互。
简单的说，它的思想是：每一个异步任务返回一个promise对象，该对象有一个then方法，允许指定回调函数。
f1.then(f2);
Promise.all
//使用场景，同时从不同地方请求多条数据时
Promise.all([
$.ajax({
url:"1.txt"
}),
$.ajax({
url:"2.txt"
})
]).then(
(data)=>{
console.log(data)
}
)generator
生成器函数 可以暂停
//1.生成器函数 优点 先等待异步完成 再执行下面的代码
//yield 后面的值给了下一个next()
function *show(){
alert(1);
let data= yield new Promise((resolve,reject)=>{
setTimeout(() => {
resolve(100);
}, 5000);
})
console.log(data);
alert(2);
}
//2.调用next() 完整
//3.变量去接 生成器函数
//生成器函数调用必须配合 .next
let s=show();
let p=s.next();
console.log(p);
console.log(p.value);
let m= p.value.then((data)=>{
s.next(data)
console.log(data);
})
// p.value.then((data)=>{
// s.next(data);
// })
//参数 变量.next(参数) =>let 变量 =>yield
//返回 yield()===> 变量.next() async/await
当前 JavaScript 中，处理异步的最佳方案。
async函数返回一个 Promise 对象，可以使用then方法添加回调函数。当函数执行的时候，一旦遇到await就会先返回，等到异步操作完成，再接着执行函数体内后面的语句。
async函数内部return语句返回的值，会成为then方法回调函数的参数。
async function show() {
alert(1);
let data = await new Promise((resolve,reject)=>{
//网络请求时间来决定的
setTimeout(() => {
resolve(100)
}, 3000);
})
console.log(data)
let Data = await new Promise((resolve,reject)=>{
//网络请求时间来决定的
setTimeout(() => {
resolve({
name:"heson",
age:12
})
}, 3000);
})
console.log(Data)
alert(2);
}
show();原文地址：https://www.cnblogs.com/heson/p/10017916.html