Try/Catch and Promiseの拒否を使用して、非同期JavaScriptコードのエラーを処理するにはどうすればよいですか？

Try/Catch and Promise Promiseの拒否による非同期JavaScriptの取り扱いエラー

非同期JavaScriptでのエラー処理には、同期コードとは異なる微妙なアプローチが必要です。 try...catch block Handles同期エラー。しかし、非同期操作は、多くの場合、約束や非同期/待ち声を使用して、別の戦略が必要です。エラー処理のために.then()および.catch()メソッドを使用することを約束します。非同期操作が失敗した場合、それは約束を拒否し、 .catch()ブロックはエラーを処理します。 try...catch Blockは、約束が解決または拒否される前に発生するエラーのみをキャッチします。

説明しましょう：

 <code class="javascript">function asyncOperation() { return new Promise((resolve, reject) => { // Simulate an asynchronous operation that might fail setTimeout(() => { const randomNumber = Math.random(); if (randomNumber  console.log(result)) .catch(error => console.error("Caught an error:", error));</code>

この例では、 asyncOperation関数が約束を返します。乱数が0.5未満の場合、約束は「成功！」で解決します。それ以外の場合、エラーオブジェクトで拒否します。 .catch()ブロックは、拒否された約束を特別に処理し、未処理の拒否エラーを防ぎます。 try...catch asyncOperation()コールの周りに配置されたキャッチブロックは、 tryブロックの実行後にエラーがスローされているため、エラーがキャッチされません。

非同期JavaScriptを超えてトライ/キャッチと約束をするためのエラー処理のためのベストプラクティス

try...catchと約束は基本的で堅牢な非同期エラー処理にはさらなるベストプラクティスが必要です。

• 一元化されたエラー処理：散乱する代わりに、コード全体に.catch()ブロックをブロックする代わりに、中央のエラー処理メカニズムを検討してください。これには、カスタムエラーハンドラー関数またはミドルウェアレイヤー（ReactやExpressなどのフレームワークを使用する場合）が含まれる場合があります。これにより、保守性が向上し、一貫したエラーレポートが可能になります。
• 特定のエラータイプ：一般的なErrorオブジェクトをキャッチしないでください。アプリケーション内の特定のエラータイプ（ NetworkError 、 AuthenticationError 、 DatabaseError ）を表すカスタムエラークラスを作成します。これにより、よりターゲットを絞ったエラー処理とデバッグが可能になります。
• 詳細なエラーメッセージ：タイムスタンプ、ユーザーコンテキスト（該当する場合）、デバッグに役立つ関連データなど、エラーメッセージに包括的な情報を含めます。 「何かがうまくいかなかった」などのあいまいなエラーメッセージを避けてください。
• ロギング：エラーとそのコンテキストをキャプチャするために、堅牢なロギングを実装します。ロギングライブラリ（Winston、Bunyanなど）を使用して、構造化されたロギングと簡単な分析を容易にします。デバッグを簡単にするために、スタックトレースを含めます。
• ユーザーフレンドリーなエラーメッセージ：ユーザーにエラーを提示するときは、技術的な詳細を表示しないでください。代わりに、問題を説明し、可能な解決策を提案する明確で簡潔でユーザーフレンドリーなメッセージを提供します。
• エラー境界（UIフレームワーク内）：ユーザーインターフェイスを構築する場合は、アプリケーション全体をクラッシュせずにコンポーネントのエラーを優雅に処理するために、エラー境界（ReactのErrorBoundaryなど）を活用してください。

Async/async/awaits with try/catch blocksを使用します

はい、 async/await効果的に使用できますtry...catch 、非同期JavaScript関数のエラーを処理します。 async/await非同期コードを見て、同期コードのようにもう少し動作させ、エラー処理をより直感的にします。 try...catch Blockは、 async関数内にスローされたエラーをキャッチします。

 <code class="javascript">async function asyncOperationWithAwait() { try { const result = await asyncOperation(); // asyncOperation from previous example console.log(result); } catch (error) { console.error("Caught an error using async/await:", error); } } asyncOperationWithAwait();</code>

この例では、 tryブロックはasyncOperation実行を試みます。 asyncOperationが拒否された場合、 catchブロックはエラーを処理します。このアプローチは.then()および.catch()を使用するよりもクリーンで読みやすいです。

非同期JavaScriptコードのスローエラーのデバッグ

非同期コードのデバッグは、エラーがすぐに発生しないか、予測可能なシーケンスで発生しない可能性があるため、困難な場合があります。ここにいくつかの効果的なデバッグ戦略があります：

• コンソールロギング：非同期コード全体にconsole.log()ステートメントを戦略的に配置して、実行の流れと変数の値を追跡します。非同期操作の前後に関連するデータを記録します。
• デバッガー：ブラウザの開発者ツール（またはnode.jsデバッガー）を使用して、コードを行ごとに踏み込みます。非同期操作の前後のブレークポイントを設定して、変数を検査し、エラーの原因を特定します。
• エラー監視ツール：生産アプリケーションには、未処理の例外を自動的にキャプチャし、詳細なスタックトレースを提供し、エラーの頻度とパターンに関する洞察を提供するエラー監視ツール（Sentry、Rollbarなど）を使用します。
• 約束の検査：約束を使用する場合は、拒否された約束オブジェクトを検査して、スタックトレースなどのエラーに関する情報を取得します。
• 非同期ロギング：メインスレッドのブロックや潜在的なマスキングエラーのブロックを防ぐために、ロギングステートメントが非同期に処理されていることを確認してください。
• コードの簡素化：複雑な非同期コードをデバッグするのに苦労している場合は、より小さくて管理しやすい関数に分解して単純化してみてください。これにより、エラーのソースを隔離しやすくなります。

以上がTry/Catch and Promiseの拒否を使用して、非同期JavaScriptコードのエラーを処理するにはどうすればよいですか？の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。