JS `Error Causes` (`Error.cause`) 与 `Structured Error Handling` 实践

各位观众老爷们，大家好！我是你们的老朋友，bug终结者小码哥。今天咱们要聊点硬核的，关于JavaScript里Error Causes（错误原因）和Structured Error Handling（结构化错误处理）的那些事儿。准备好了吗？Let’s dive in!

第一幕：错误世界的旧秩序

在没有Error.cause的蛮荒时代，我们处理错误就像是在黑暗中摸索。假设你有一个函数，负责从服务器获取数据：

async function fetchData(url) {
  try {
    const response = await fetch(url);

    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`);
    }

    const data = await response.json();
    return data;

  } catch (error) {
    // 悲剧的错误处理
    console.error("Error fetching data:", error.message);
    throw error; // 抛出原始错误，信息丢失
  }
}

async function processData() {
  try {
    const data = await fetchData("https://api.example.com/data");
    console.log("Data:", data);
  } catch (error) {
    console.error("Error processing data:", error.message);
  }
}

processData();

问题来了：当processData捕获到错误时，它只知道“Error processing data”。但原始的fetchData中发生的HTTP错误信息（状态码等）已经被丢失了。我们只能通过字符串拼接错误信息来勉强保留一些上下文，但这种方式既不优雅，也不利于程序化的错误分析。

第二幕：救星登场 – Error.cause

Error.cause就像黑暗中的一盏明灯，它允许我们将原始错误作为新错误的“原因”附加上去，从而保留完整的错误链。让我们用Error.cause重写上面的例子：

async function fetchData(url) {
  try {
    const response = await fetch(url);

    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`, { cause: response }); // 传递response作为原因
    }

    const data = await response.json();
    return data;

  } catch (error) {
    // 改进的错误处理
    console.error("Error fetching data:", error);
    throw new Error("Failed to fetch data", { cause: error }); // 创建新错误，并传递原始错误作为原因
  }
}

async function processData() {
  try {
    const data = await fetchData("https://api.example.com/data");
    console.log("Data:", data);
  } catch (error) {
    console.error("Error processing data:", error); // 打印整个错误对象
    console.error("Original Error:", error.cause); // 获取原始错误
    if(error.cause instanceof Error){
        console.error("Original Error Message:", error.cause.message); //获取原始错误消息
    }
  }
}

processData();

现在，processData捕获到的错误对象，其cause属性包含了原始的Error对象（或者response对象，取决于你在哪里设置的cause）。这意味着我们可以轻松地访问原始错误的详细信息，而无需进行字符串解析。这简直是太棒了！

第三幕：深入Structured Error Handling

Error.cause是Structured Error Handling的基础。结构化错误处理不仅仅是关于错误的原因，更是关于如何以一种清晰、一致的方式组织和处理错误。核心思想是：

错误分类： 将错误划分为不同的类别，例如网络错误、验证错误、权限错误等。
错误标准化： 为每种错误类别定义标准化的错误对象，包含特定的属性。
错误追踪： 使用Error.cause来追踪错误的根本原因。

让我们创建一个简单的例子，模拟一个用户注册流程：

// 定义自定义错误类
class ValidationError extends Error {
  constructor(message, field, cause) {
    super(message);
    this.name = "ValidationError";
    this.field = field;
    this.cause = cause; // 传递原因
  }
}

class AuthenticationError extends Error {
  constructor(message, cause) {
    super(message);
    this.name = "AuthenticationError";
    this.cause = cause;
  }
}

class DatabaseError extends Error {
  constructor(message, query, cause) {
    super(message);
    this.name = "DatabaseError";
    this.query = query;
    this.cause = cause;
  }
}

async function validateUsername(username) {
  if (!username || username.length < 5) {
    throw new ValidationError("Username must be at least 5 characters long", "username");
  }
  return true;
}

async function validatePassword(password) {
  if (!password || password.length < 8) {
    throw new ValidationError("Password must be at least 8 characters long", "password");
  }
  return true;
}

async function createUserInDatabase(username, password) {
  try {
    // 模拟数据库操作
    if (username === "duplicate") {
      throw new Error("Username already exists"); // 模拟数据库冲突
    }
    // 假设数据库操作成功
    return { id: 123, username: username };
  } catch (error) {
    throw new DatabaseError("Failed to create user in database", "INSERT INTO users ...", error);
  }
}

async function registerUser(username, password) {
  try {
    await validateUsername(username);
    await validatePassword(password);
    const user = await createUserInDatabase(username, password);
    return user;
  } catch (error) {
    if (error instanceof ValidationError) {
      console.error("Validation Error:", error.message, "Field:", error.field);
      // 可以针对不同的验证错误采取不同的措施
      throw error; // 重新抛出错误
    } else if (error instanceof DatabaseError) {
      console.error("Database Error:", error.message, "Query:", error.query, "Cause:", error.cause);
      // 可以记录数据库错误，并尝试重试
      throw new AuthenticationError("Registration failed due to database issue", error); // 封装成新的错误
    } else {
      console.error("Unexpected Error:", error);
      throw new Error("Registration failed", { cause: error }); // 封装成通用错误
    }
  }
}

// 使用示例
async function main() {
  try {
    const newUser = await registerUser("short", "12345678");
    console.log("User registered:", newUser);
  } catch (error) {
    console.error("Registration failed:", error);
    if(error.cause){
        console.error("Root cause:", error.cause)
    }
  }

  try {
      const newUser = await registerUser("duplicate", "password");
      console.log("User registered:", newUser);
  } catch (error) {
      console.error("Registration failed:", error);
      if(error.cause){
          console.error("Root cause:", error.cause)
      }
  }
}

main();

在这个例子中，我们定义了ValidationError、AuthenticationError和DatabaseError三种自定义错误类。每个错误类都包含了特定的属性，例如ValidationError包含了field属性，表示哪个字段验证失败。 DatabaseError包含了query属性，表示执行的数据库查询语句。所有错误都使用了Error.cause来追踪原始错误。

在registerUser函数中，我们使用instanceof来判断错误的类型，并根据不同的错误类型采取不同的处理措施。例如，对于ValidationError，我们打印错误信息和字段名。对于DatabaseError，我们记录数据库错误，并尝试重试。

第四幕：最佳实践与注意事项

保持错误信息清晰： 错误信息应该足够清晰，能够帮助开发者快速定位问题。
不要吞噬错误： 如果无法处理错误，应该将其重新抛出，或者封装成一个新的错误。
使用Error.cause追踪错误链： 这可以帮助你快速找到错误的根本原因。
定义自定义错误类： 这可以帮助你更好地组织和处理错误。
错误日志记录： 将错误信息记录到日志中，以便后续分析。可以使用console.error，也可以使用更专业的日志库（例如winston或pino）。
不要滥用 try-catch： 避免在不必要的地方使用 try-catch，这会降低代码的可读性。只在需要处理错误的地方使用 try-catch。
单元测试： 编写单元测试来验证你的错误处理逻辑是否正确。
考虑使用 TypeScript： TypeScript的类型系统可以帮助你更好地定义和处理错误类型。

第五幕：一些小技巧

错误聚合： 如果你需要同时处理多个异步操作，可以使用Promise.allSettled来聚合错误。

async function processFiles(files) {
  const results = await Promise.allSettled(files.map(async (file) => {
    // 假设processFile可能抛出错误
    return await processFile(file);
  }));

  const errors = results.filter(result => result.status === 'rejected');

  if (errors.length > 0) {
    // 创建一个聚合错误
    const aggregateError = new AggregateError(
      errors.map(error => error.reason),
      "Failed to process some files"
    );
    throw aggregateError;
  }

  return results.filter(result => result.status === 'fulfilled').map(result => result.value);
}

全局错误处理： 在浏览器环境中，你可以使用window.onerror来捕获全局未处理的错误。在Node.js环境中，你可以使用process.on('uncaughtException')和process.on('unhandledRejection')。但是，请谨慎使用全局错误处理，因为它可能会掩盖一些潜在的问题。

第六幕：总结

特性	描述	优势
`Error.cause`	允许将原始错误作为新错误的“原因”附加上去，形成错误链。	保留完整的错误上下文，方便调试和分析。
自定义错误类	创建自定义的错误类，用于表示特定类型的错误。	使错误处理更加结构化和可维护。可以为每种错误类型定义特定的属性和方法。
`try...catch`	用于捕获可能抛出异常的代码块。	允许你在发生错误时执行特定的处理逻辑，例如记录错误、重试操作或向用户显示错误信息。
`Promise.allSettled`	允许你并发地执行多个Promise，并等待所有Promise都完成（无论是resolve还是reject）。	即使其中一些Promise reject，其他Promise仍然会继续执行。可以用于处理需要同时执行多个异步操作的情况。
全局错误处理	使用`window.onerror`（浏览器）或`process.on('uncaughtException')`和`process.on('unhandledRejection')`（Node.js）来捕获全局未处理的错误。	可以捕获那些没有被`try...catch`块捕获的错误。但是，请谨慎使用全局错误处理，因为它可能会掩盖一些潜在的问题。
错误日志记录	将错误信息记录到日志中，以便后续分析。可以使用`console.error`，也可以使用更专业的日志库（例如`winston`或`pino`）。	方便你跟踪和分析错误，从而改进代码质量。
单元测试	编写单元测试来验证你的错误处理逻辑是否正确。	确保你的错误处理代码能够正确地处理各种错误情况。
TypeScript	使用 TypeScript的类型系统可以帮助你更好地定义和处理错误类型。	提高代码的可读性和可维护性，减少运行时错误。
错误分类与标准化	将错误划分为不同的类别，例如网络错误、验证错误、权限错误等。为每种错误类别定义标准化的错误对象，包含特定的属性。	让错误处理更加清晰、一致。可以根据不同的错误类型采取不同的处理措施。

总而言之，Error.cause和Structured Error Handling是构建健壮、可维护的JavaScript应用的关键。希望今天的讲座能够帮助你更好地理解和应用这些技术。记住，代码写得好，bug自然少！谢谢大家！

发表回复 取消回复

发表回复取消回复