async、await、promise使用

當你的請求必須是有順序的，但是又不能發送同步請求的時候，async、await和promise能幫助你解決這個問題

1. 當請求必須按順序發送時，請求的多層嵌套，讓代碼龐雜，讀寫困難，可以使用promise操作簡化此操作

     function a() {
        return new Promise(function (resolve, reject) {
            $.ajax({
                url: './test.json',
                success: function (res) {
                    resolve(res)
                },
                error: function (e) {
                    reject(e);
                }
            })
        })
    }
     function b() {
         return new Promise(function (resolve, reject) {
             $.ajax({
                 url: './test.json',
                 success: function (res) {
                     resolve(res)
                 },
                 error: function (e) {
                     reject(e);
                 }
             })
         })
     }
   a().then(function (res) {
       console.log(111);
   }).then(function (res) {
       b().then(function () {
           console.log(222)
       }).then(function () {
           console.log(333)
       })
   })

輸出結果如下：

2.上述方式通過嵌套多個then的方式，也能按照希望順序執行代碼，下面要介紹async、await和promise結合實現同步的方式
注意：await只能在async類型的方法中執行

async function a() {
        return new Promise(function (resolve, reject) {
            $.ajax({
                url: './test.json',
                success: function (res) {
                    console.log("aaa")
                    resolve(res)
                },
                error: function (e) {
                    reject(e);
                }
            })
        })
    }

    async function b() {
        console.log("bbb")
    }

    async function c() {
     	 // 一
        await a();  
          // 二
        await b(); 
         //  三
        console.log("ccc"); 
    }

    c();

執行結果如下：

依然順序執行
由於a函數中含有異步操作，所以使用await保證一執行完後在執行二三
如果：

async function c() {
         a();
         b();
        console.log("ccc")
    }

結果如下：