讓異步操作同步執行的方法詳解

 下面我們看一個最簡單的例子, 我的需求是要在fn1函數外面打印msg

        function fn1() {
            setTimeout(function () {
                msg = '你等我一下我  3s';
            }, 3000);
        }
        fn1();

那么怎么樣才能在fn函數中獲取到msg呢

通過回調函數

  function fn1(callBack) {
            setTimeout(function () {
                msg = '你等我一下我 3s';
                callBack(msg);//回調
            }, 3000);
        }

 fn1(function (c) {
      alert(c)
 })

 es6

 fn1(c => {
     alert(c)
 })

promise 將異步請求改成promise 通過.then()的方式 進行調用

function fn1() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            msg = '你等我一下我 3s';
            resolve(msg)
        }, 3000);
    })
}

//通過.then()的方式 進行調用
fn1().then(res => {
    alert(res)
})

通過await 和async來處理

   function fn1() {
            return new Promise((resolve, reject) => {
                setTimeout(() => {
                    msg = '你等我一下我 3s';
                    resolve(msg)
                }, 3000);
            })
        }

        async function passpro() {
            let res = await fn1();
            alert(res)
        }

        passpro();

async函數返回的是一個Promise對象

如果一個函數加了async關鍵詞,這個函數又有返回值,
在調用這個函數時,如果函數執行成功,
內部會調用Promise.solve()方法返回一個Promise對象.

如果函數執行出現異常,
就會調用Promise.reject()方法返回一個promise 對象