Skip to content

错误处理

错误处理是 JavaScript 编程中的重要概念。在程序运行过程中,可能会出现各种错误,如语法错误、运行时错误、网络错误等。通过适当的错误处理机制,我们可以使程序更加健壮和用户友好。

错误类型

JavaScript 中有多种类型的错误:

SyntaxError(语法错误)

javascript
// 语法错误示例
// let a = ; // SyntaxError: Unexpected token ';'

ReferenceError(引用错误)

javascript
// 引用未声明的变量
// console.log(undefinedVariable); // ReferenceError: undefinedVariable is not defined

TypeError(类型错误)

javascript
// 对非函数使用调用操作符
// let num = 42;
// num(); // TypeError: num is not a function

RangeError(范围错误)

javascript
// 数值超出有效范围
// let arr = new Array(-1); // RangeError: Invalid array length

其他错误类型

  • URIError:使用全局 URI 处理函数时发生的错误
  • EvalError:eval() 函数相关的错误(已废弃)

try...catch 语句

try...catch 语句用于捕获和处理同步代码中的错误:

javascript
try {
    // 可能出现错误的代码
    let result = riskyOperation();
    console.log(result);
} catch (error) {
    // 处理错误
    console.error("发生错误:", error.message);
} finally {
    // 无论是否有错误都会执行的代码
    console.log("清理工作完成");
}

function riskyOperation() {
    // 模拟可能出错的操作
    if (Math.random() > 0.5) {
        throw new Error("随机错误");
    }
    return "操作成功";
}

Error 对象

Error 对象包含有关错误的详细信息:

javascript
try {
    throw new Error("这是一个自定义错误");
} catch (error) {
    console.log("错误名称:", error.name);        // "Error"
    console.log("错误消息:", error.message);     // "这是一个自定义错误"
    console.log("错误堆栈:", error.stack);       // 错误堆栈跟踪
}

自定义错误类型

javascript
// 创建自定义错误类
class CustomError extends Error {
    constructor(message) {
        super(message);
        this.name = "CustomError";
    }
}

try {
    throw new CustomError("这是自定义错误");
} catch (error) {
    if (error instanceof CustomError) {
        console.log("捕获到自定义错误:", error.message);
    } else {
        console.log("其他类型的错误:", error.message);
    }
}

异步错误处理

回调函数中的错误处理

javascript
// 传统的错误优先回调模式
function asyncOperation(callback) {
    setTimeout(() => {
        if (Math.random() > 0.5) {
            callback(new Error("异步操作失败"));
        } else {
            callback(null, "操作成功");
        }
    }, 1000);
}

// 使用回调处理错误
asyncOperation((error, result) => {
    if (error) {
        console.error("回调错误:", error.message);
    } else {
        console.log("回调结果:", result);
    }
});

Promise 中的错误处理

javascript
function promiseOperation() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            if (Math.random() > 0.5) {
                reject(new Error("Promise 操作失败"));
            } else {
                resolve("Promise 操作成功");
            }
        }, 1000);
    });
}

// 使用 .catch() 处理错误
promiseOperation()
    .then(result => {
        console.log("Promise 结果:", result);
    })
    .catch(error => {
        console.error("Promise 错误:", error.message);
    });

全局错误处理

window.onerror(浏览器环境)

javascript
// 捕获未处理的 JavaScript 错误
window.onerror = function(message, source, lineno, colno, error) {
    console.error("全局错误:", {
        message: message,
        source: source,
        lineno: lineno,
        colno: colno,
        error: error
    });
    
    // 返回 true 阻止默认的错误处理
    return true;
};

通过合理的错误处理机制,我们可以创建更加健壮和用户友好的应用程序。记住要始终处理可能发生的错误,并提供有意义的错误消息和恢复机制。