JavaScript の例外処理メソッドを一緒に分析しましょう

この記事では、JavaScript に関する関連知識を提供します。主に例外処理に関連する問題を紹介します。プログラムを作成する過程で、いくつかのエラーは避けられません。これらのエラーを通じて、エラーの発生を回避する方法を学ぶことができます。見てみましょう。この状況でどうすればよいのか、次回はどうすれば改善できるのか、皆さんのお役に立てれば幸いです。

[関連する推奨事項: JavaScript ビデオ チュートリアル 、Web フロントエンド ]

エラーは、プログラミングプロセス。プログラムを作成する過程では必ずエラーが発生しますが、そのエラーを通じて、そのような状況を回避する方法や、次回より良くする方法を学ぶことができます。

JavaScript では、コード ステートメントが緊密に結合されてエラーが発生した場合、残りのコード ステートメントを使用し続けることは意味がありません。その代わりに、私たちは間違いからできるだけ丁寧に回復しようとします。このようなエラーが発生すると、JavaScript インタプリタは例外処理コードをチェックし、例外ハンドラがない場合、プログラムはエラーの原因となった関数に戻ります。

例外ハンドラーが見つかるか、最上位関数に到達するまで、コール スタック上のすべての関数に対してこれを繰り返します。これにより、プログラムがエラーで終了し、プログラムがクラッシュします。

一般的に、これを処理するには 2 つの方法があります:

• 例外をスローする- 実行時に発生した場合問題を意味のある方法で処理することはできません。問題をスローすることをお勧めします。

function openFile(fileName) {
  if (!exists(fileName)) {
    throw new Error('找不到文件 ' + fileName)
  }
  // ...
}

• 例外のキャッチ#スローされた例外は、実行時に発生する可能性が高くなります。意味が捉えられ、処理される場所

try {
  openFile('../test.js')
} catch(e) {
  // 优雅地处理抛出的期望
}

これらの操作をさらに詳しく理解しましょう。

例外をスローする

「ReferenceError: spec is not found」のようなメッセージが表示される場合があります。これは、throw ステートメントによってスローされた例外を表します。

構文

throw «value»
// 不要这样做
if (somethingBadHappened) {
  throw 'Something bad happened'
}

例外としてスローできるデータ型に制限はありませんが、JavaScript には特別な組み込み例外タイプがあります。前の例で見たように、そのうちの 1 つはエラーです。これらの組み込み例外タイプは、例外メッセージよりも詳細な情報を提供します。

#Error

#Error タイプは、一般的な例外を表すために使用されます。このタイプの例外は、ユーザー定義の例外を実装するために最も一般的に使用されます。利用可能な 2 つの組み込みプロパティがあります。

• message — Error コンストラクターにパラメーターとして渡されるコンテンツ。たとえば、new Error('これはエラー メッセージです') です。メッセージ プロパティを通じてメッセージにアクセスできます。

const myError = new Error('Error!!!')
console.log(myError.message) // Error!!!

• stack — このプロパティは、エラーの原因となったファイルの履歴 (呼び出しスタック) を返します。スタックの最上位にはメッセージも含まれており、その後に、最新/分離されたエラー ポイントから最も外側の原因ファイルまでの実際のスタックが続きます。

Error: Error!!!
    at <anonymous>:1:1

注: new Error('...') はスローする前に操作を実行しません。つまり、 throw new Error('error msg') は Error インスタンスを作成して停止します。 Error エラーを捕捉するなど、Error エラーに対して何らかの操作を行わない限り、スクリプトは実行されません。

例外のキャッチ

例外の概要と例外のスロー方法がわかったので、次は例外をキャッチしてプログラムの破壊を防ぐ方法について説明します。

try-catch-finally は、例外を処理する最も簡単な方法です。

try {
  // 要运行的代码
} catch (e) {
  // 发生异常时要运行的代码
}
  
[ // 可选
  finally {
    // 无论发生异常都始终执行的代码
  }
]

try 句に、例外を生成する可能性のあるコードを追加します。例外が発生すると、catch 句が実行されます。

コードが例外を生成するかどうかに関係なく、コードを実行する必要がある場合があります。この場合、オプションのfinallyブロックを使用できます。

try 句または catch 句が return ステートメントを実行する場合でも、finally ブロックは実行されます。たとえば、次の関数は、finally 句が最後に実行されるため、「Executefinally」を返します。

function foo() {
  try {
    return true
  } finally {
    console.log('Execute finally')
  }
}

コードの正確性を事前に確認できない場合は、try-catch を使用します。

const user = '{"name": "D.O", "age": 18}'
try {
  // 代码运行
  JSON.parse(params)
  // 在出现错误的情况下，其余的代码将永远无法运行
  console.log(params)
} catch (err) {
  // 在异常情况下运行的代码
  console.log(err.message) // params is not defined
}

上で示したように、コードを実行する前に JSON.parse で stringify オブジェクトまたは文字列をチェックすることはできません。

注: プログラムで生成された例外と実行時例外はキャッチできますが、JavaScript 構文エラーはキャッチできません。

try-catch-finally は同期エラーのみをキャッチできます。これを非同期コードで使用しようとすると、非同期コードの実行が完了する前に try-catch-finally が実行されてしまう可能性があります。

非同期コード ブロックで例外を処理する方法

コールバック関数

コールバック関数を使用します (推奨されません)。以下に示すように、2 つのパラメーターを受け取ります:

async function(code, (err, result) => {
  if (err) return console.error(err)
  console.log(result)
})

2 つのパラメーターがあることがわかります: err と result。エラーが発生した場合、err パラメータはエラーと等しくなり、例外処理のためにスローできます。

在 if (err) 块中返回某些内容或将其他指令包装在 else 块中都很重要。否则，您可能会遇到另一个错误。例如，当您尝试访问 result.data 时，result 可能未定义。

Promises

使用 promises 的 then 或者 catch，我们可以通过将错误处理程序传递给 then 方法或使用 catch 子句来处理错误。

promise.then(onFulfilled, onRejected)

也可以使用 .catch(onRejected) 而不是 .then(null, onRejected) 添加错误处理程序，其工作方式相同。

让我们看一个 .catch 拒绝 Promise 的例子。

Promise.resolve('1')
  .then(res => {
    console.log(res) // 1
    throw new Error('go wrong') // 抛出异常
})
.then(res => {
  console.log(res) // 不会被执行
})
.catch(err => { 
  console.error(err) // 捕获并处理异常 ——> Error: go wrong
})

使用 async/await 和 try-catch

使用 async/await 和 try-catch-finally，处理异常是轻而易举的事。

async function func() {
  try {
    await nonExistentFunction()
  } catch (err) {
    console.error(err) // ReferenceError: nonExistentFunction is not defined 
  }
}

如何处理未捕获的异常

现在我们已经很好地理解了如何在同步和异步代码块中执行异常处理，让我们回答本文最后一个待解决的问题 ：我们如何处理未捕获的异常？

在浏览器中

我们可以使用 window.onerror() 方法来处理未捕获的异常。每当运行时发生错误时，该方法会在 window 对象上触发 error 事件。

onerror() 的另一个实用做法是：当站点中的图片或视频等数据加载出错时，可以用该方法触发某些操作。例如，提供一张加载出错时的图片，或显示一条消息。

<img src="logo.png" onerror="alert(&#39;Error loading picture.&#39;)" />

在 Node.js 中

EventEmitter 模块派生的 process 对象可以订阅事件 uncaughtException。

process.on('uncaughtException', () => {})`

我们可以传递一个回调来处理异常。如果我们尝试捕获这个未捕获的异常，进程将不会终止，因此我们必须手动完成。

uncaughtException 仅适用于同步代码。对于异步代码，还有另一个称为 unhandledRejection 的事件。

process.on('unhandledRejection', () => {})

决不要尝试为基本 Error 类型实现 “捕获所有” 处理程序。这将混淆所发生的一切，并损害代码的可维护性和可扩展性。

关键要点

throw 语句用于生成用户定义的异常。在运行时，当 throw 遇到语句时，当前函数的执行将停止，控制权将传递给 catch 调用堆栈中的第一个子句。如果没有 catch 子句，程序将终止

JavaScript 有一些内置的异常类型，最值得注意的是 Error，它返回 Error 中的两个重要属性：stack 和 message。

try 子句将包含可能产生异常的代码，catch 子句会在发生异常时执行。

对于异步代码，最好使用 async/await 配合 try-catch 语句。

可以捕获未处理的异常，这可以防止应用程序崩溃。

不要觉得麻烦，异常处理可以帮助您提高代码的可维护性、可扩展性和可读性。

【相关推荐：javascript视频教程、web前端】

以上がJavaScript の例外処理メソッドを一緒に分析しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。