当前位置:首页 > javascript > 正文内容

Javascript try catch的使用

hxing6411年前 (2024-01-13)javascript4267

说到 try...catch 都觉得非常熟悉了,不就是用来捕捉代码块中的错误嘛,平时也用得比较多的。然而因为了解不够多,我的面试却栽在了一个简单的知识点上:try...catch 只能捕捉到同步执行代码块中的错误。 题目是:以下代码有错吗?如果有错,应该如何改正?

JavaScript
try {
  setTimeout(() => {
    throw new Error('err')
  }, 200);
} catch (err) {
  console.log(err);
}
 
try {
  Promise.resolve().then(() => {
    throw new Error('err')
  })
} catch (err) {
  console.log(err);
}


反正就是不知道咋回事,我之前的知识储备中就是没有这个知识点:try...catch不能异步捕获代码错误,因为它本身就是一个同步代码块。所以看到这道题我就懵了,平时代码不就是这样写的吗,用try...catch来捕获错误,所以当时就直接回了我不知道,感觉没有啥错误。。。,面试官无奈的看了我一眼,下来可以了解一下,然后就没有然后了。


下来我就赶紧查了资料,才知道try...catch不能异步捕获代码错误。在 JavaScript 中,setTimeout 是一个异步函数,它的回调函数会在指定的延时后被放入事件队列,等待当前执行栈清空后才执行。因此,当setTimeout的回调函数执行并抛出错误时,try...catch已经执行完毕,无法捕捉到异步回调中的错误。


正确的做法是在异步操作中直接处理错误,例如使用回调函数、Promises 或者 async/await 结合 try...catch

JavaScript
new Promise((resolve, reject) => {
  setTimeout(() => {
    try {
      throw new Error('err');
    } catch (err) {
      reject(err);
    }
  }, 200);
})
  .then(() => {
    // 正常执行时的处理逻辑
  })
  .catch((err) => {
    console.log(err); // 这里会捕捉到错误
  });


至于第二个例子,尝试使用try...catch来捕捉一个在Promise链中抛出的错误。这种方式同样是无效的,因为try...catch不能捕捉到在Promise链中的异步错误。


Promise 对象用于表示一个异步操作的最终完成(或失败),及其结果值。一个Promise的状态可能是以下几种:

Pending(等待态) :初始状态,既不是成功,也不是失败状态。

Fulfilled(成功态) :意味着操作成功完成。

Rejected(失败态) :意味着操作失败。

在Promise中抛出一个错误(例如通过throw语句)会导致Promise被拒绝(或失败)。要正确处理这个错误,需要在Promise链中使用.catch方法或者在一个async函数中使用try...catch。

JavaScript
// 方法一
Promise.resolve()
  .then(() => {
    throw new Error('err');
  })
  .catch((err) => {
    console.log(err); // 这里会捕捉到错误
  });

// 方法二
async function handleError() {
  try {
    await Promise.resolve().then(() => {
      throw new Error('err');
    });
  } catch (err) {
    console.log(err); // 这里会捕捉到错误
  }
}
 
handleError();


扫描二维码推送至手机访问。

版权声明:本文由星星博客发布,如需转载请注明出处。

本文链接:http://xingxinghan.cn/?id=512

“Javascript try catch的使用” 的相关文章

js项目常用正则集合

手机号/^1[3|4|5|6|7|8|9][0-9]\d{8}$/邮箱/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/匹配中文字符/[\u4e00-\u9fa5]/匹配空白行/\n\s*\r/匹配网址URL/[a-zA-z]+://...

JS逆向实战20——深入解析JavaScript虚拟机逆向工程

在Web开发领域中,JavaScript(JS)是一门广泛使用的编程语言。然而,由于其脚本性质和开放性,JavaScript代码的安全性一直备受关注。为了保护知识产权和提高代码的安全性,一些开发者会将JavaScript代码进行加密和混淆。这就需要逆向工程师掌握JS逆向技术来还原加密和混淆后的代码。...

js模块化历程

这是一篇关于js模块化历程的长长的流水账,记录js模块化思想的诞生与变迁,展望ES6模块化标准的未来。经历过这段历史的人或许会感到沧桑,没经历过的人也应该知道这段历史。 无模块时代在ajax还未提出之前,js还只是一种“玩具语言”,由Brendan Eich花了不到十天时间发明,用来在网页...

JavaScript中的setTimeout和setInterval

JavaScript是一门广泛应用于网页开发的脚本语言,它提供了许多强大的功能和特性。其中,setTimeout和setInterval是两个常用的定时器函数,它们可以在指定的时间间隔内执行代码。本文将深入探讨这两个函数的用法和特点,并通过代码示例来加深理解。...

深入理解JavaScript原型链

JavaScript原型链是该语言中一个核心的概念,理解它对于成为一名优秀的JavaScript开发者至关重要。在本篇文章中,我们将深入探讨JavaScript原型链的工作原理、如何使用原型链来实现继承,以及一些与原型相关的最佳实践。 原型链是什么?...

JavaScript中的call、bind和apply方法深度解析

JavaScript是一种动态的、强大的编程语言,它的灵活性源于其独特的函数调用方式。在JavaScript中,我们常常会遇到三个非常重要的函数方法:call、bind和apply。这些方法都是用来改变函数运行时this的指向的。理解它们的工作原理和使用场景,对于我们编写高质量的Java...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。