异步编程 - 墨码山河

摘要：本文主要学习了常见的几种实现异步。

1 回调函数

在微任务队列出现之前，JS实现异步的主要方式就是通过回调函数，即通过AJAX请求的回调函数实现异步调用。

示例：

$.ajax({
  url:'/api/getData',
  type:'get',
  dataType:'json',
  success:function(res) {
    if (res.success) {
      alert('调用成功');
    }
  }
});

这种异步调用不能控制顺序，如果想在第一个回调函数执行后再执行第二个回调函数，就需要将第二个回调函数嵌套在第一个回调函数中，这种回调函数中嵌套回调函数的情况就叫做回调地狱。

2 Promise

Promise作为典型的微任务之一，它的出现可以使JS达到异步执行的效果。

示例：

function adder(arg) {
  return new Promise((resolve) => {
    resolve(++arg);
  })
}
function sum() {
  adder(1)
    .then(val => adder(val))
    .then(val => console.log(val));
}
sum();// 3

3 Generator

Generator和Promise都是在ES6新增的，Generator返回的是一个Iterator对象。

示例：

function * add(arg) {
  console.log(++arg);// 2
  yield arg;
  console.log(++arg);// 3
}
let iterator = add(1);
console.log(iterator.next());// {value: 2, done: false}
console.log(iterator.next());// {value: undefined, done: true}

4 async和await

async和await是ES7提出的关于异步的终极解决方案，进一步简化了Promise的代码。

示例：

function adder(arg) {
  return new Promise((resolve) => {
    resolve(++arg);
  })
}
async function sum() {
  // adder(1)
  //   .then(val => adder(val))
  //   .then(val => console.log(val))
  let val = await adder(1);
  val = await adder(val);
  console.log(val);
}
sum();// 3