JS備忘

1. Promise用法

js異步調用較多，若是某個操做是基於上個異步結果才能執行的，再有一個操做又是基於此操做的，則須要嵌套多層代碼，在ES6中引入了Promise寫法，能夠比較優雅的解決這個問題：

    <script type="text/javascript">
        function runAsync1(para) {
            var p = new Promise(function (resolve, reject) {
                //作一些異步操做
                setTimeout(function () {
                    console.log('異步任務1執行完成');
                    resolve(para + 1);
                }, 1000);
            });
            return p;
        }
        function runAsync2(para) {
            var p = new Promise(function (resolve, reject) {
                //作一些異步操做
                setTimeout(function () {
                    console.log('異步任務2執行完成');
                    resolve(para + 2);
                }, 2000);
            });
            return p;
        }
        function runAsync3(para) {
            var p = new Promise(function (resolve, reject) {
                //作一些異步操做
                setTimeout(function () {
                    console.log('異步任務3執行完成');
                    resolve(para + 3);
                }, 2000);
            });
            return p;
        }

        runAsync1(1)
        .then(function (data1) {
            console.log(data1);
            return runAsync2(data1);
        })
        .then(function (data2) {
            console.log(data2);
            return runAsync3(data2);
        })
        .then(function (data3) {
            console.log(data3);
        });

    </script>

 輸出的結果是：

異步任務1執行完成
2
異步任務2執行完成
4
異步任務3執行完成
7

 只須要看最後幾行就能夠，第一個then接收runAsync1的返回值data1能夠將其傳遞給第二個操做，第二個then接收runAsync2的返回值data2將其當作參數傳遞給第三個操做。