async await搭配promise的使用

2021-09-01 13:00:28 字數 2517 閱讀 9947

注意:

使用async / await, 搭配promise, 可以通過編寫形似同步的**來處理非同步流程, 提高**的簡潔性和可讀性. 本文介紹async / await的基本用法和一些注意事項.

引用mdn的介紹:

await 操作符用於等待乙個 promise 物件, 它只能在非同步函式 async function 內部使用.

await 的使用語法非常簡單:

[return_value] = await expression;

其中 expression 是乙個 promise 物件或者任何要等待的值;

而 await expression 的執行結果有以下幾種情況:

若 expression 是乙個 promise 物件, 並且其以值 x 被 fulfilled, 則返回值為 x.

若 expression 是乙個 promise 物件, 並且其以異常 e 被 rejected, 則丟擲異常 e.

若 expression 不是 promise 物件, 則會將 expression 處理成乙個以 expression 值被 fulfilled 的 promise 物件, 然後返回這個 promise 物件的最終值 (即 expression 值). 這種用法沒太大意義, 因此實際使用時還是盡量在 await 後跟乙個 promise 物件.

另外需要注意的是, await 在等待 promise 物件時會導致 async function 暫停執行, 一直到 promise 物件決議之後才會 async function 繼續執行.

通過一段**來看一下:

async function foo() , 2000);

});console.log(a); // 第2秒時輸出: 1

try , 1000);

})} catch (e)

// 函式暫停2秒後再繼續執行

var sleep = await new promise((resolve) => , 2000);

});var c = await 3;

console.log(c); // 第5秒時輸出: 3

}foo();

使用async function可以定義乙個非同步函式, 語法為:

async function name([param[, param[, ... param]]])

async 函式的返回值很特殊: 不管在函式體內 return 了什麼值, async 函式的實際返回值總是乙個 promise 物件. 詳細講就是:

若在 async 函式中 return 了乙個值 x, 不管 x 值是什麼型別, async 函式的實際返回值總是 promise.resolve(x).

那麼 promise.resolve(x) 最終返回乙個什麼樣的promise呢? 來看一下mdn的介紹:

promise.resolve(value)方法返回乙個以給定值解析後的promise物件。但如果這個值是個thenable(即帶有then方法),返回的promise會「跟隨」這個thenable的物件,採用它的最終狀態(指resolved/rejected/pending/settled);否則以該值為成功狀態返回promise物件。

接下來看一段**的應用. 假設有這樣乙個場景: 需要先通過 請求1 拿到 資料1, 然後通過通過 請求2 並攜帶傳送 資料1 獲取到 資料2, 拿到 資料2 之後再展示到頁面.

方案一:

async function showdata() , 1000);

});// 假裝請求資料2且此請求依賴資料1

var data2 = await new promise((resolve) => , 1000);

});// 展示資料2

console.log(data2);

}showdata();

上面這段**是依次獲取到資料1資料2, 然後再展示資料2.

既然async函式總是返回乙個promise, 那麼也可以在乙個async函式返回獲取資料2的promise, 呼叫函式後再使用then方法拿到資料, **如下:

async function getdata() , 1000);

});// 假裝請求資料2且此請求依賴資料1

return new promise((resolve) => , 1000);

});}getdata().then((v) => );

借鑑:

async await,實現同步

作為一名初學者,對於 而言,自然是對比於之前學過的知識,這樣才能判斷意義 對於promise了解不深入,但也稍微記錄,加深自我的印象。作為新特性來說,功能必然更好,就對比之前ajax來說,promise能夠將非同步轉為同步。如 async function ajaxtest url return n...

使用async await 總結

async await 迴圈並行處理 同步 同一執行緒之中,順序完成不同的操作,是一種阻塞模式 後乙個請求操作需要等待前乙個操作完成之後,才能發出。非同步 需要開啟不同的執行緒,是非阻塞模式。同步類似於打 而非同步相當於發簡訊。傳送請求獲取天氣非同步操作,利用node fetch完成請求 const...

非同步async await寫法

async await 用asyncio提供的 asyncio.coroutine可以把乙個generator標記為coroutine型別,然後在coroutine內部用yield from呼叫另乙個coroutine實現非同步操作。為了簡化並更好地標識非同步io,從python 3.5開始引入了新...