ES6和ES7非同步處理的詳解（程式碼範例）

這篇文章帶給大家的內容是關於ES6和ES7非同步處理的詳解（程式碼範例），有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。

一次掌握ES6/ES7非同步處理

假定一個場景，等女朋友睡起來出去逛街，超過5s就不等了，自己打遊戲了...

ES6 Promise 處理方式

promise 寫法
promise鍊式呼叫方法，只有當異步處理成功後回到用.then(data => {}) 拿到非同步處理成功後的數據
非同步處理出錯時，會呼叫.then(err => {}) 取得到異常
也就是說.then( data => {}, err => {}) 方法裡有兩個回呼函數作為參數
或還有第二種寫法.then(data => {}).catch(err => {})

function waiting (ms) {
    return new Promise ( (resolve, reject) => {
        if(ms > 5000) {
            reject('long time')
        } else {
            setTimeout(() => {
                resolve(ms);
            }, ms)
        }
    })
}


function main () {
    waiting(3000).then( success => {
        console.log(success);
    }, err => {
        console.log(err)
    })
}

// 或者
function main() {
    waiting(3000).then(data => {
        console.log(data)
    }).catch(err => {
        console.log(err);
    })
}

ES7 Async/Await 處理方式

async 表示這個函數裡面有非同步操作，await總是寫在async宣告的函數中的
遇到awit，函數就會停止執行，等待非同步操作結束，再執行後面的語句
非同步操作所取得的結果即為resolve回呼函數的參數回傳
異常即透過reject回呼函數參數取得
注意，當捕獲異常時，我們往往需要在async函數體中使用try catch 方式取得異常

let sleep = ms => {
    return new Promise ( (resolve, reject) => {
        if(ms > 5000) {
            reject('long time')
        } else {
            setTimeout(function() {
                resolve(ms)
            } ,ms)
        }
    })
}

let play = (ms) => {
    console.log(`I wait you ${ms} s`)
}

let main = async () => {
    try{
        let result = await sleep(3000);
        play(result)
    } catch (err) {
        throw err
    }
}

注意：await等的是什麼?是promise是承諾回傳的是resolve回呼函數裡面的資料

以上是ES6和ES7非同步處理的詳解（程式碼範例）的詳細內容。更多資訊請關注PHP中文網其他相關文章！