js: async-await

時間 2019-12-13

原文原文鏈接

　　async是一種用同步的方式編寫異步代碼的方法，與promise同樣也是非阻塞的。promise

　　返回值：異步

　　async的返回值是一個promise對象。async

　　執行順序：函數

　　async的異步指的是async函數後面的代碼是異步的，但async裏面仍是同步的，但須要注意的是，這裏的同步不是說await後面的函數沒執行完就不往下執行（指async裏面的await後面的代碼），而是，當調用async函數，程序執行到await時，1.會先去執行一遍await裏面的代碼，2.再回到調用async函數後面繼續執行，3.完了以後再回到async裏面的await後面繼續執行。前面說的執行一遍不是說所有執行完畢，await後面的函數裏若是有一個定時器（5s），那麼，程序並不會等待5s後再執行步驟1，而是執行定時器的時候，異步去執行步驟1後面的。spa

　　來看兩個例子：code

　　1.若是await後面的函數的返回值是一個直接值，或者沒有返回值的普通函數。對象

    <script>
        function sleep(sec) {
            console.log('執行1');
            setTimeout(function () {
                console.log('執行2');
            }, sec * 1000)
        }

        async function show() {
            console.log('start...');
            let res = await sleep(5);
            console.log('執行3');
        }
        show();
        console.log('執行4');
        console.log('執行5');
    </script>

　　輸出結果：blog

　　//start...隊列

　　//執行1ip

　　//執行4

　　//執行5

　　//執行3

　　//執行2

　　2.若是await後面返回的是一個promise對象。

       function sleep(sec) {
            console.log('執行1');
            return new Promise(function (resolve, reject) {
                setTimeout(function () {
                    resolve('aaa');//若是不執行resolve，程序不會繼續往下執行
                    console.log('執行2');
                }, sec * 1000)
            })
        }

        async function show() {
            console.log('start...');
            let res = await sleep(5);
            // console.log(res);
            console.log('執行3');
        }
        show();
        console.log('執行4');
        console.log('執行5');