溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
一、異步編程的終極解決方案
前幾天寫過關于 javascript 異步操作的文章《Javascript Promise 詳解》. 最近在學習 Puppeteer 的時候又發現另一種異步編程解決方案：Async/Await.
異步操作是 JavaScript 編程的麻煩事，麻煩到一直有人提出各種各樣的方案，試圖解決這個問題。 從最早的回調函數，到 Promise 對象，再到 Generator 函數，每次都有所改進，但又讓人覺得不徹底。 它們都有額外的復雜性，都需要理解抽象的底層運行機制。
在 Async 函數出來之后，有人認為它是異步編程的最終解決方案。因為有了 Async/Await 之后，你根本就不用關心是它是不是異步編程。
二、基本用法
async 函數返回一個 Promise 對象，可以使用 then 方法添加回調函數。 當函數執行的時候，一旦遇到 await 就會先返回，等到觸發的異步操作完成，再接著執行函數體內后面的語句。
下面是一個栗子：
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve();
}, time);
})
};
var start = async function () {
// 在這里使用起來就像同步代碼那樣直觀
console.log('start');
await sleep(3000);
console.log('end');
};
start();
執行上面的代碼，你會發現，控制臺先輸出start，稍等3秒后，輸出了end。
三、注意事項
1、await 命令只能用在 async 函數之中，如果用在普通函數，就會報錯。
async function dbFuc(db) {
let docs = [{}, {}, {}];
// 報錯
docs.forEach(function (doc) {
await db.post(doc);
});
}
2、await 表示在這里等待promise返回結果了，再繼續執行。
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
// 返回 ‘ok'
resolve('ok');
}, time);
})
};
var start = async function () {
let result = await sleep(3000);
console.log(result); // 收到 ‘ok'
};
3、await 后面跟著的應該是一個promise對象。
如果是同步執行的代碼沒有必要使用 await 修飾了。
4、await 只能使用在原生語法中，比如在 forEeach 結構中使用 await 是無法正常工作的，必須使用 for 循環的原生語法。
async function dbFuc(db) {
let docs = [{}, {}, {}];
// 可能得到錯誤結果
docs.forEach(async function (doc) {
await db.post(doc);
});
}
如果確實希望多個請求并發執行，可以使用 Promise.all 方法。
async function dbFuc(db) {
let docs = [{}, {}, {}];
let promises = docs.map((doc) => db.post(doc));
let results = await Promise.all(promises);
console.log(results);
}
四、錯誤捕獲
既然.then(..)不用寫了，那么.catch(..)也不用寫，可以直接用標準的try catch語法捕捉錯誤。
var sleep = function (time) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
// 模擬出錯了，返回 ‘error'
reject('error');
}, time);
})
};
var start = async function () {
try {
console.log('start');
await sleep(3000); // 這里得到了一個返回錯誤
// 所以以下代碼不會被執行了
console.log('end');
} catch (err) {
console.log(err); // 這里捕捉到錯誤 `error`
}
};
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
