Articles
JavaScript简介
JavaScript中的错误处理

JavaScript中的错误处理

本文解释了JavaScript中的错误处理。

YouTube Video

JavaScript中的错误处理

JavaScript中的错误处理是捕获和适当处理程序遇到意外问题时错误的一个重要功能。通常情况下，使用try...catch语法来捕获和处理错误。此外，在处理Promises或异步操作时，还可以使用async/await或Promise.prototype.catch进行错误处理。

try...catch语法

try...catch用于捕获和处理代码块内发生的错误。

 1try {
 2    // Code that may throw an error
 3    let result = riskyFunction();
 4    console.log(result);
 5} catch (error) {
 6    // Catch and handle the error
 7    console.error("An error occurred:", error.message);
 8} finally {
 9    // Code that will always execute
10    console.log("Error handling has completed.");
11}
  • 如果try块内部发生错误，程序的执行将中断，并执行catch块。
  • finally块总会执行，无论是否发生错误。它对于释放资源和进行最终处理等非常有用。

抛出错误（throw）

在JavaScript中，可以使用throw关键字显式触发错误。它用于抛出自定义错误消息或自定义错误。

 1function checkAge(age) {
 2    if (age < 18) {
 3        throw new Error("You are under 18 years old.");
 4    }
 5    return "Age verification completed.";
 6}
 7
 8try {
 9    let result = checkAge(15);
10    console.log(result);
11} catch (error) {
12    console.error(error.message);  // Displays "You are under 18 years old."
13}

异步操作中的错误处理（Promise和async/await）

在执行异步操作时，错误处理略有不同。使用Promises时，错误通过catch方法捕获。

1let promise = new Promise((resolve, reject) => {
2    // Asynchronous operation
3    setTimeout(() => reject(new Error("An issue has occurred!")), 1000);
4});
5
6promise
7    .then(result => console.log(result))
8    .catch(error => console.error(error.message));  // Displays "An issue has occurred!"

在使用async/await执行异步操作时，可以使用try...catch处理错误。

 1async function fetchData() {
 2    try {
 3        let response = await fetch('https://api.example.com/data');
 4        let data = await response.json();
 5        console.log(data);
 6    } catch (error) {
 7        console.error("An error occurred while fetching data:", error.message);
 8    }
 9}
10
11fetchData();

总结

  • 可以使用try...catch语法捕获同步错误。
  • 可以使用throw抛出自定义错误。
  • 异步操作中的错误可以使用Promise的catch方法，或者使用async/await和try...catch处理。

通过使用这些方法，可以确保程序即使在发生错误时也能正常运行。

Error

Error类用于错误处理。它提供了创建错误并提供错误消息和堆栈跟踪的功能。

1try {
2    throw new Error("Something went wrong");
3} catch (e) {
4    console.log(e.message); // Something went wrong
5}

基本用法

发生错误时，可以显式地创建一个 Error 对象。你可以使用 new Error() 创建实例并传递错误消息。

1const error = new Error("Something went wrong");
2console.log(error.message);  // "Something went wrong"
3console.log(error.name);     // "Error"
4
5// Stack trace (information about where the error occurred)
6console.log(error.stack);

Error 对象的属性

Error 对象具有以下属性。

  • message：这是错误消息。
  • name：错误的名称，默认值为 "Error"。
  • stack：包含错误发生位置的堆栈跟踪，对调试非常有用。

使用 throw 抛出错误

在 JavaScript 中，你可以使用 throw 关键字抛出一个错误。这用于在特定情况下中断处理，并将控制权传递给错误处理程序。

1function doSomething() {
2    throw new Error("This function is not yet implemented");
3}
4
5try {
6    doSomething();
7} catch (e) {
8    console.error(e.message);  // "This function is not yet implemented"
9}

通过 throw 抛出的错误可以通过 try...catch 语法捕获。

创建自定义错误

在 JavaScript 中，你可以通过扩展 Error 类来创建自己的自定义错误。这使你可以创建适合特定情况的错误。

 1class CustomError extends Error {
 2    constructor(message) {
 3        super(message);  // Call the parent class constructor
 4        this.name = "CustomError";  // Set the error name
 5    }
 6}
 7
 8try {
 9    throw new CustomError("A custom error has occurred");
10} catch (e) {
11    console.error(e.name);    // "CustomError"
12    console.error(e.message); // "A custom error has occurred"
13}

内置错误类

JavaScript 有几个扩展自 Error 类的内置错误类。这些用于表示特定错误。

  • ReferenceError：当引用一个不存在的变量时发生。
  • TypeError：当值的类型与期望的类型不同步时发生。
  • RangeError：当数字超出允许范围时发生。
  • SyntaxError：当执行不符合语法的代码时发生。
  • EvalError：与使用 eval() 函数有关的错误。如今很少使用。
  • URIError：当使用无效的 URI（编码或解码错误）时发生。
示例：ReferenceError

以下是一个 ReferenceError 示例。

1try {
2    console.log(undefinedVariable);  // Undefined variable
3} catch (e) {
4    console.error(e.name);    // "ReferenceError"
5    console.error(e.message); // "undefinedVariable is not defined"
6}
示例：TypeError

以下是一个 TypeError 示例。

1try {
2    null.f();  // Attempting to call a function on null
3} catch (e) {
4    console.error(e.name);    // "TypeError"
5    console.error(e.message); // "Cannot read properties of null (reading 'f')"
6}

finally 块

在 try...catch 语法中，使用 finally 块来执行无论是否发生错误都想执行的操作。

1try {
2    throw new Error("An issue has occurred");
3} catch (e) {
4    console.error(e.message);  // "An issue has occurred"
5} finally {
6    console.log("Performing cleanup");
7}

在此示例中，即使抛出错误，finally 块中的操作也会被执行。

异常处理的好处

通过正确地实现错误处理，可以防止应用程序在发生意外行为时崩溃。通过适当地使用 try...catch 语法和错误对象，可以编写更健壮的代码。

 1function divide(a, b) {
 2    if (b === 0) {
 3        throw new Error("Cannot divide by zero");
 4    }
 5    return a / b;
 6}
 7
 8try {
 9    console.log(divide(4, 0));  // An error will occur
10} catch (e) {
11    console.error(e.message);   // "Cannot divide by zero"
12}

总结

  • Error 类用于表示错误原因并执行错误处理。
  • 使用 try...catch...finally 语法处理错误并防止应用程序意外终止。
  • 也可以扩展 Error 类以创建自定义错误。
  • 您可以通过使用内置的错误类（如 TypeError 和 ReferenceError）来处理各种类型的错误。

您可以在我们的YouTube频道上使用Visual Studio Code跟随上述文章进行学习。 请也查看我们的YouTube频道。

YouTube Video

JavaScript中的模块JavaScript中的`严格模式`