JavaScript の Promise.allSettled() と async-await について説明しますか?

Promise.allSettled() は、Promise の反復可能をパラメータとして受け取り、反復可能内のすべての Promise が解決されたときに解決される Promise を返すメソッドです。つまり、それらは実現されたか拒否されたかです。

返された Promise が履行されると、履行または拒否された Promise に関する情報を含むオブジェクトの配列を通じて解決されます。各オブジェクトにはステータス属性 (完了または拒否) と、値または理由属性があります。

たとえば、ネットワーク リクエストを表す一連の Promise があり、各リクエストのステータス (成功したかどうか) を知りたい場合は、Promise.allSettled() を使用してすべてのリクエストを待機できます。結果を処理する前に完了する必要があります。

Promise.all解決済み

Promise.allSettled() の使用は、複数の Promise (履行されたか拒否されたか) の結果を処理する場合に便利です。すべての Promise が満たされた場合にのみ解決され、いずれかの Promise が拒否された場合は拒否される Promise.all() とは異なります。

＃＃＃文法＃＃＃

Promise.allSettled() を使用するための構文は次のとおりです -

リーリー

Iterable は、promise.allSettled() に提供される入力です。 Iterable オブジェクトは Promise を含む配列です。

非同期待機

JavaScript の async および await キーワードは、非同期コードを処理するために使用されます。 async は関数定義の前に使用され、関数が非同期であり、Promise を返すことを示します。

＃＃＃文法＃＃＃ リーリー

await は、指定された Promise が満たされるまで実行を一時停止するために、非同期関数内で使用されます。

リーリー

Promise.allSetlled と async-await

async/await 構文は、非同期コードの外観と動作を同期コードに近づけ、読み書きを容易にする方法です。これにより、コールバックや then() メソッドを必要とせずに、同期コードのように見える非同期コードを作成できます。

async/await 構文を使用すると、結果にアクセスする前に Promise.allSettled() メソッドが解決されるのを待つことができます。

これは、Promise.allSettled() を async/await で使用する例です -

リーリー

次に、実際の

Promise.allSettled()

の 2 つの使用例を示します。

ネットワークリクエストの処理

• フォームでのユーザー入力の処理

• 例 1

ネットワーク リクエスト (HTTP リクエストなど) の配列があり、成功したかどうかに関係なくすべてのリクエストの結果を処理したい場合は、Promise.allSettled() を使用してすべてのリクエストが完了するのを待つことができます。結果を処理する前に。

リーリー

入力フィールドのあるフォームがあり、フォームを送信する前にすべてのフィールドを検証するとします。この場合、Promise.allSettled() を使用して、すべての検証 Promise が完了するのを待ってから、フォームを送信するかどうかを決定できます。

従うべき手順は次のとおりです:

ステップ 1

- HTML ドキュメントで、入力フィールドを含むフォームを作成します。その ID を入力として受け取ります。

• ステップ 2
- フォームの送信時に呼び出される
• validateForm()

  関数を定義します。

  ステップ 3
-
• validateForm()

  関数内で、 document.getElementById() > メソッドを使用して入力フィールドの値を取得します。 。

  ステップ 4
-
• validateInput()

  関数を使用して検証約束の配列を作成し、入力フィールドの値を引数として渡します。

  ステップ 5 -
• Promise.allSettled()

  を使用して、すべての検証 Promise が完了するまで待ちます。

  ステップ 6
-
• Promise.allSettled()

  の結果を反復処理し、各結果オブジェクトの status プロパティを確認します。 Promise が拒否された場合は、hasErrors フラグを true に設定し、エラー メッセージを記録します。

  ステップ 7
- hasErrors フラグが false の場合、フォームは有効とみなされ、送信できます。 hasErrors フラグが true の場合、フォームにはエラーがあるため、送信しないでください。

• ステップ 8
- onsubmit 属性を HTML フォームの form 要素に追加し、
• validateForm()

  関数を呼び出すように設定します。 validateForm() 関数が false を返した場合は、return false ステートメントを使用してフォームが送信されないようにします。 例 2

  リーリー
Promise.allSettled() は、ネットワーク リクエストの処理やユーザー入力の検証など、さまざまな状況で使用でき、async/await 構文または then() メソッドと組み合わせて使用​​して、完全な値を処理できます。約束。

以上がJavaScript の Promise.allSettled() と async-await について説明しますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。