Async/Awaitは、同期コードのように見える非同期コードを書くことができるModern JavaScript(およびPythonやC#などの他のプログラミング言語)の強力な機能です。これを達成するためにasync/async/awaitを使用する方法は次のとおりです。
非同期関数を宣言する:async/awaitを使用するには、非同期関数を定義する必要があります。これを行うには、関数宣言の前にasync
キーワードを追加することで行うことができます。これが例です:
<code class="javascript">async function fetchData() { // Asynchronous operations here }</code>
await
キーワードを使用してください:ASYNC関数内では、約束の前にawait
キーワードを使用できます。これにより、関数が約束が解決するまで実行を一時停止し、解決された値で再開できます。フェッチAPIを使用した例を次に示します。
<code class="javascript">async function fetchData() { const response = await fetch('https://api.example.com/data'); const data = await response.json(); return data; }</code>
この例では、 fetch
約束を返し、 await
行列に約束が解決するまで待機させます。解決するawait
、応答はresponse.json()
を使用してJSONに変換されます。
Async関数を呼び出す:非同期関数を呼び出して結果を処理するには、 .then()
を使用するか、別の非同期関数内でそれをawait
できます。 fetchData
を呼び出す方法は次のとおりです。
<code class="javascript">fetchData().then(data => console.log(data)) .catch(error => console.error('Error:', error)); // or async function useData() { try { const data = await fetchData(); console.log(data); } catch (error) { console.error('Error:', error); } }</code>
これらの手順に従うことにより、同期的に見えるように非同期操作を作成し、コードを読みやすくしやすくすることができます。
Async/awaitを使用すると、非同期プログラミングにおける従来のコールバック方法よりもいくつかの利点があります。
Async/awaitを使用した効果的なエラー処理には、Async関数内でTry/Catchブロックを使用することが含まれます。これがあなたがそれを行う方法です:
Try/Catchブロックを使用してください:あなたの待ち合わせ式をトライブロックに包み、キャッチブロックでエラーを処理します。
<code class="javascript">async function fetchData() { try { const response = await fetch('https://api.example.com/data'); if (!response.ok) { throw new Error('Network response was not ok'); } const data = await response.json(); return data; } catch (error) { console.error('There was a problem with the fetch operation:', error); // You can also rethrow the error or handle it further throw error; } }</code>
エラー伝播:非同期関数のエラーをコールスタックに伝播することができ、必要に応じてより高いレベルでキャッチできるようにします。
<code class="javascript">async function useData() { try { const data = await fetchData(); console.log(data); } catch (error) { console.error('Error in useData:', error); } }</code>
複数の待機:複数の待ち表現がある場合は、すべての潜在的なエラーをキャッチするために、それらがすべてトライブロック内にいることを確認してください。
<code class="javascript">async function processData() { try { const data1 = await fetchData1(); const data2 = await fetchData2(data1); // Process both data1 and data2 } catch (error) { console.error('Error in processData:', error); } }</code>
Async/await機能を実装するときは、これらの一般的な落とし穴に注意してください。
await
を忘れて:非同期関数内の約束でawait
を使用するのを忘れた場合、関数は解決する約束を待ちません。これは予期しない動作につながる可能性があります:
<code class="javascript">async function fetchData() { const response = fetch('https://api.example.com/data'); // Missing await const data = response.json(); // This will not work as expected return data; }</code>
async
:不必要な約束の作成によりasync
オーバーヘッドにつながる可能性があるため、待ちの表現を含む機能を不必要に使用しないでください。async
をawait
でいます: async
非同期として関数をマークすることを忘れないでください。しかし、約束が解決するまで実際に実行を一時停止するのはawait
。これを誤解すると、コードが誤っている可能性があります。これらの落とし穴を認識し、ベストプラクティスに従うことにより、async/async/asyncを使用して、クリーンで効率的な非同期コードを書くことができます。
以上がAsync/await関数を使用して、同期しているように見える非同期コードを作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。