非同期機能
async / awaitは、ES8に追加された2つの新しい関数キーワードであり、同期的に記述されたコードを非同期で実行できるようにします。
1.非同期
asyncキーワードは、非同期関数を宣言するために使用されます。このキーワードは、関数宣言、関数式、矢印関数、およびメソッドの前に使用できます。
async function f() {
return 1;
}
非同期関数が戻り値を含む値を返す場合（戻り値がない場合は未定義を返します）、この値は解決されたPromiseに自動的にラップされ、結果が値になります。
async function f() {
return 1;
}
f().then(console.log); // 1
asyncは、関数がPromiseを返し、Promise以外の値をラップすることを保証します
2.待つ
awaitは、非同期関数でのみ機能します。このキーワードは、非同期関数コードの実行を一時停止し、Promiseが解決されるのを待つことができます。
async function f() {
let promise = new Promise((resolve, reject) => {
setTimeout(() => resolve("done!"), 1000)
});
let p = await promise; // 暂停
console.log(p); // 一秒后 "done!";
}
f();
この関数は
、promiseが解決して実行を継続するときに、pの値が取得されるまで待機行で一時停止されます。promise.thenと比較すると、promiseの結果を取得するためのより洗練された構文であり、簡単です。読み書きします。
上記の関数は次のように書き直すことができます。
let promise = new Promise((resolve,reject)=>{
setTimeout(()=> resolve("done!"),1000)
});
promise.then(console.log);
ps。Awaitは通常の関数では使用できず、M
<script>タグなどのトップレベルのコンテキストでは使用できませんが、非同期関数を定義してすぐに実行できます
(async function f(){
console.log(await Promise.resolve(1));
})();
awaitキーワードを完全に理解するには、値が使用可能になるのを待っているだけではないことを知っておく必要があります。JavaScriptランタイムがawaitキーワードを検出すると、実行が中断された場所を記録します。待機の右側の値が使用可能になると、JavaScriptランタイムはタスクをメッセージキューにプッシュし、このタスクは非同期関数の実行を再開します。
async function foo() {
console.log(2);
await null;
console.log(4);
}
console.log(1);
foo();
console.log(3);
// 1
// 2
// 3
// 4
awaitの後にすぐに使用可能な値が続く場合でも、関数の後半部分は非同期で評価されます
総括する
非同期関数は、JavaScript関数にコントラクトを適用した結果です。非同期関数は、メインスレッドをブロックせずに実行を一時停止できます。
関数の前のキーワードasyncには、次の2つの効果があります。
- この関数は常にpromiseを返します。
- この関数内でawaitを使用できます。
キーワードはpromiseの前に待機し、JavaScriptエンジンはpromiseが解決するのを待機します。
- エラーが発生した場合、スローエラーが呼び出されたのと同じように、例外がスローされます。
- それ以外の場合は、結果が返されます。