异步编程的实现方式：

  • 回调函数；
  • Promise
  • Generator
  • async / await

    Promise

    1. console.log('script start') // 1
    2. let promise1 = new Promise(function (resolve) {
    3.   console.log('promise1') // 2
    4.   resolve()
    5.   console.log('promise1 end') // 3 这个地方为什么比 4 先打印，还是不太明白，需注意
    6. }).then(function () {
    7.   console.log('promise2') // 5
    8. })
    9. setTimeout(function(){
    10.   console.log('settimeout') // 6
    11. })
    12. console.log('script end') // 4
    13. // 输出顺序: script start->promise1->promise1 end->script end->promise2->settimeout
    解析：
  1. promise1.then()的回调是一个 task；
  2. promise1是 resolve或 rejected时，那这个 task会被放入当前事件的microtask queue（微任务队列）中；
  3. promise1是 pending时，这个 task会被放入事件循环未来的某个（可能是下一个）回合的 microtask queue（微任务）中；
  4. setTimeout的回调也是一个 task，它会被放入 macrotask queue（宏任务队列）中，即使是 0ms。

    Generator

    async / await

    1. async function async1(){
    2. console.log('async1 start'); // 2
    3.  await async2(); // 可看成 Promise().then()
    4.  console.log('async1 end') // 5
    5. }
    6. async function async2(){
    7.  console.log('async2') // 3
    8. }
    9. console.log('script start'); // 1
    10. async1();
    11. console.log('script end') // 4
    12. // 输出顺序：script start->async1 start->async2->script end->async1 end