非同期操作の理解と JavaScript での async/await の使用

すでにご存知のとおり、JavaScript はシングルスレッド言語であり、一度に 1 つのアクションを実行できます。ただし、サーバーからのデータの取得やディスク内のファイルの読み取りなど、Web 開発における多くの操作は、完了するまでに時間がかかることがあります。これらの操作を同期的に実行する場合、つまり JavaScript はコードの次の行に進む前に操作が完了するまで待機する必要があり、アプリケーションの応答性が遅くなります。このようなタスクをより効率的に完了するために、JavaScript は非同期プログラミング手法を採用します。

非同期操作とは何ですか?

非同期操作は、現時点で開始されるが、プログラムが他のコード行を続行している間に別の時点で終了できる操作です。 JavaScript では、非同期動作の処理は、コールバック、プロミス、そして最後には async/await 構文を使用して行われます。このアプローチにより、JavaScript がバックグラウンドでタスクを実行できるようになり、Web アプリの全体的なパフォーマンスが向上します。
たとえば、ユーザーに関する情報をデータベースから取得する必要がある Web アプリケーションの場合を考えてみましょう。ネットワークの速度やサーバーへの高トラフィックによっては、このプロセスに数秒かかる場合があります。 JavaScript は、データの受信を待つ間にアプリケーションを停止するのではなく、残りのコードを続行できます。この種のノンブロッキング動作は、非同期プログラミングの背後にある基本的な考え方です。

async/await の導入

ES2017 (ES8) の一部である async/await 構文は、おそらく、非同期コードを処理するための最もエレガントで理解しやすい手段です。これは Promise に基づいており、理解しやすく保守しやすいように、非同期コードを同期コードのように見せる方法を提供します。
非同期関数は、戻り値の型として Promise を持つ関数です。 async キーワードを関数に付加すると、実際に Promise が返されるかどうかに関係なく、関数が常に Promise を返すようにプログラムに指示されます。 Await は、関数が Promise の完了または拒否を待機できるようにするために、非同期関数内で使用されます。

async/await はどのように機能しますか?

ここで、例を使って async/await を使用する方法を説明します。ユーザーのショッピング カートを取得して表示する次のコード スニペットを考えてみましょう:

この例では、getCart 関数は async として宣言されているため、関数内で非同期操作を処理するために await キーワードを使用できます。

1. const cart = await req.user.getCart();: これはユーザー オブジェクトの getCart メソッドを呼び出し、ユーザーの現在のカート インスタンスを取得します。 await キーワードを使用すると、JavaScript は getCart() によって返された Promise が完了するまで待機します。解決された値 (ユーザーのカート) はカート変数に割り当てられます。
2. const products = await cart.getProducts();: 同様に、この行は、製品をユーザーのカートに入れる getProducts メソッドが完了するまで、コードの実行を一時停止します。 await キーワードは、製品データの準備ができるまで次のコード行を実行しないように CLR に指示します。
3. レスポンスのレンダリング: 両方の非同期操作が完了すると、変数 res.render() が実行され、商品の横にカート ページがレンダリングされます。
4. try...catch によるエラー処理: try...Finally、catch ブロックは、非同期操作によって発生する可能性のある例外を処理するために使用されます。 await ステートメントのいずれかでエラーが発生した場合、catch ブロックがエラーを処理し、コンソールに記録します。

async/await を使用する利点

async/await 構文には、従来の Promise ベースのコードに比べていくつかの利点があります:async/await 構文には、従来の Promise ベースのコードに比べていくつかの利点があります:
• 可読性の向上: 非同期操作を処理できるにもかかわらず、コードは通常の同期コードのように見えるため、理解しやすくなります。
• エラー処理: try...Async/await を使用すると、sync/async でエラーをキャッチするのと同じくらい簡単かつ均一なエラー処理が可能になります。
• 複雑な操作の簡素化: コードの作成、テスト、デバッグが容易になるため、複数の非同期操作を含むコードには async/await を使用する必要があります。

Kesimpulan

Pengaturcaraan async amat penting dalam JavaScript untuk melaksanakan operasi intensif pengiraan tanpa menghalang urutan utama. Sintaks async/wait menawarkan beberapa cara yang lebih canggih untuk menangani operasi ini dan kod yang dihasilkan lebih mudah dibaca, lebih bersih dan lebih mudah untuk nyahpepijat. Async/wait membantu pembangun menulis kod tak segerak, yang menjadikan aplikasi mereka lebih boleh diramal dan lebih pantas.

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