JavaScript 中 try...catch 的 10 个使用技巧

更新日期: 2023-04-11阅读: 942标签: 异常

作为一位 Web 前端工程师,JavaScript 中的 try...catch 是我们常用的特性之一。

try...catch 可以捕获代码中的异常并防止应用程序崩溃。但是try...catch 不仅仅是简单地捕获异常。本文我将分享 10 个有用的 try...catch 使用技巧,让你在处理异常时更加得心应手。

1. 捕获所有异常

如果你想捕获代码中所有可能的异常,可以使用一个不带参数的 catch 代码块。例如:

try {
  // 可能会抛出异常的代码
} catch {
  // 处理所有异常的代码
}

这种方式会捕获所有异常,包括语法错误运行时错误自定义错误。但是,在生产环境中使用时,建议具体指定要捕获的异常类型,以便更好地诊断问题。

2. 捕获特定类型的异常

如果你只想捕获特定类型的异常,可以在 catch 代码块中使用条件语句。例如,以下代码块只会捕获 TypeError 异常:

try {
  // 可能会抛出 TypeError 异常的代码
} catch (error) {
  if (error instanceof TypeError) {
    // 处理 TypeError 异常的代码
  }
}

你也可以使用 switch 语句来检查异常类型:

try {
  // 可能会抛出异常的代码
} catch (error) {
  switch (error.constructor) {
    case TypeError:
      // 处理 TypeError 异常的代码
      break;
    case RangeError:
      // 处理 RangeError 异常的代码
      break;
    // ...
  }
}

3. 捕获异步异常

如果你使用了异步代码,你可能需要捕获异步代码中的异常。例如,以下代码块使用 Promise 来异步加载资源:

try {
  const resource = await fetch("/resource");
  // 处理资源的代码
} catch (error) {
  // 处理异常的代码
}

如果在异步操作中发生异常,它会被传递到 catch 代码块中。但是,如果你没有使用 try...catch 来捕获异常,它将被视为未处理的异常。

4. 在 finally 代码块中清理资源

如果你使用了一些需要手动清理的资源(例如文件句柄或网络连接),可以在 finally 代码块中进行清理操作。无论 try 代码块中是否发生异常,finally 代码块中的代码都会执行。例如:

let resource;
try {
  resource = acquireResource();
  // 处理资源的代码
} catch (error) {
  // 处理异常的代码
} finally {
  releaseResource(resource);
}

5. 抛出异常

try...catch 不仅可以捕获异常,还可以抛出异常。你可以使用 throw 语句在代码中手动抛出异常。例如:

function divide(a, b) {
  if (b === 0) {
    throw new Error("除数不能为零");
  }
  return a / b;
}

如果在 divide 函数中 b 的值为 0,则会抛出一个包含错误消息的异常。你可以使用 try...catch 来捕获这个异常并执行相应的操作。

6. 在异常中传递额外信息

在抛出异常时,你可以传递一些额外的信息来帮助调试问题。例如:

function divide(a, b) {
  if (b === 0) {
    throw new Error("除数不能为零", { a, b });
  }
  return a / b;
}

在这个例子中,异常对象包含了除数为零时的 a 和 b 的值。当你捕获这个异常时,你可以访问这些值并进行相应的操作。

7. 将异常重新抛出

有时,在处理异常时,你需要将异常重新抛出以便于更高层次的代码进行处理。你可以使用 throw 语句来重新抛出异常。例如:

try {
  // 可能会抛出异常的代码
} catch (error) {
  // 处理异常的代码
  throw error;
}

在这个例子中,异常会被重新抛出并传递到调用函数中进行处理。

8. 捕获错误并忽略它们

有时,在调试代码时,你可能希望暂时忽略一些错误。你可以使用空的 catch 代码块来忽略异常。例如:

try {
  // 可能会抛出异常的代码
} catch {
  // 忽略异常
}

但是,建议不要在生产环境中使用这种方式。在生产环境中忽略异常可能会导致代码无法预料的行为。

9. 使用 Promise.catch 方法

如果你使用 Promise 来处理异步代码,你可以使用 Promise.catch 方法来捕获异常。例如:

fetch("/resource")
  .then((response) => response.json())
  .then((data) => {
    // 处理数据的代码
  })
  .catch((error) => {
    // 处理异常的代码
  });

在这个例子中,如果 fetch 或 json 方法返回异常,它们会被传递到 catch 方法中进行处理。

10. 使用 window.onerror

最后一个技巧是使用 window.onerror 来全局捕获异常。当页面中发生未处理的异常时,window.onerror 会被调用。你可以在 window.onerror 中记录异常信息,以便于在生产环境中诊断问题。例如:

window.onerror = function handleError(message, source, lineno, colno, error) {
  // 记录异常信息
};

在这个例子中,当页面中发生异常时,handleError 函数会被调用,并将异常信息作为参数传递进来。你可以在这个函数中记录异常信息并将其发送到服务器以便于分析。

结论

在 JavaScript 中,try...catch 是一个强大的异常处理工具。它可以帮助你诊断和调试代码中的问题,并确保你的代码在运行时能够处理异常情况。通过掌握这 10 个使用技巧,你可以更好地使用 try...catch 并编写出更健壮的代码。

来自:https://segmentfault.com/a/1190000043644046

链接: https://fly63.com/article/detial/12431

前端JS 异常处理实践

大多时候(除:网络故障与请求被阻止外),使用fetch()返回的 Promise被标记为resolve,包括(接收到一个代表错误的 HTTP 状态码时,HTTP 响应的状态码是 404 或 500,但是,此时会将 resolve 的返回值的 ok 属性设置为 false

JavaScript错误处理权威指南

JavaScript 错误和一般处理 throw new Error(\'something went wrong\') 会在 JavaScript 中创建一个错误实例,并停止脚本的执行,除非你对错误做了一些处理。当你作为 JavaScript 开发者开启自己的职业生涯时,你自己很可能不会这样做

慎用try catch

ECMA-262第3版引入了try catch语句,作为JavaScript中处理异常的一种标准方式。基本的语法如下所示。但是在前端js代码中很少看到try catch语句,并不是所以代码都需要加try catch来作得不偿失的保险

前端开发中的Error以及异常捕获

在前端项目中,由于JavaScript本身是一个弱类型语言,加上浏览器环境的复杂性,网络问题等等,很容易发生错误。做好网页错误监控,不断优化代码,提高代码健壮性是一项很重要的工作

PHP异常处理机制

异常(Exception)是一种错误处理机制,用于在指定的错误发生时改变脚本的正常流程。当异常被触发时,当前代码状态被保存,代码执行被切换到预定义的异常处理器函数(如果有)

js中的异常处理

js中的异常处理语句有两个,一个是try……catch……,一个是throw。try……catch用于语法错误,错误有name和message两个属性。throw用于逻辑错误。对于逻辑错误,js是不会抛出异常的

关于try、catch、finally的执行顺序

try中没有抛出异常,则catch语句不执行,如果有finally语句,则接着执行finally语句,继而接着执行finally之后的语句;不管是否try...catch,finally都会被执行。当try...catch中有return的话,finally后会执行try...catch中的return

Laravel异常:捕获,处理和创建

很多开发者在开发过程中都会遇到异常,处理过程大同小异:捕获然后处理,事实上也确实是如此。只是从laravel自带的Exception入手,谈一谈怎样用一个更好的方式处理错误信息。

js中try、catch、finally的执行规则

首先一个常识就是,在浏览器执行JS脚本过程中,当出现脚本错误,并且你没有手动进行异常捕捉时,他会在浏览器下面出现黄色的叹号,这是正常的

Node中异常:exit code与 dockerfile

最近观察项目 CI 跑的情况如何时,会偶尔发现一两个镜像虽然构建成功但是容器跑不起来的情况。究其原因,是因为一个 exit code 的问题

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!