JavaScriptで非同期処理を行うasyncとawaitの使い方

Async/await は Promise の非同期処理をより簡潔かつ効率的に記述できるメイン関数です 非同期処理は、処理結果を待たずにすぐに次の処理を実行できる仕組みです。Promise を利用することで簡単に実装できます。 。

Promiseの場合はthenを使って接続するので非常に単調なコードになります。

たとえば、「then」を使用して複数の Promise プロセスを実行する場合、次のようになります:

getDate()
.then(function(data) {
    return getYear(data)
}) .then(function(year) {
    return getSomething(year)
}) .then(function(item) {
    getAnotherThing(item)
})

場合によっては、Promise.all() を使用する方がよい場合もありますが、その場合はまだ使用する必要があります。

async/await の使い方を学べば効率が向上します。

async/await を使用するにはどうすればよいですか?

まずは基本的な構文を見てみましょう

asyncは関数を定義することができ、関数の前に書くだけで非同期処理を行うことができます。

async function() { }

このように async を書くと、この関数は Promise を返します。

また、await は Promise の処理結果が返ってくる前に一時停止する演算子です。

await Promise处理

Promise の処理を​​記述する関数の前に await を記述するだけで、結果が返されるまで一時停止します。

ただし、await は async で定義された関数にのみ使用できることに注意してください。

このため、async / await はペアで使用されることがよくあります。

async/awaitを使った非同期処理の書き方は？

まず、次のようなPromise処理を想定します。

function myPromise(num) {
  return new Promise(function(resolve) {
 
    setTimeout(function() { resolve(num * num) }, 3000)
 
  })
}

この例では、意図的に3秒かかる処理がPromiseに記録されていることが分かります。

then を使用せずに async/await を使用する場合は次のようになります。

async function myAsync() {
    var result = await myPromise(10);
    console.log(result);
}

実行結果は100

この例では、asyncを割り当てて非同期処理関数を作成しています。

関数内の Promise 処理が myPromise() の前に待機するという説明

これは一時的に Promise 処理を待機し、3 秒後に結果が返され、結果が取得されたら、処理は続行されます。

実行結果は、指定したパラメータ10を乗算した値100が得られます。

以上がJavaScriptで非同期処理を行うasyncとawaitの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。