try-catch

最新推荐文章于 2024-03-07 17:02:51 发布

Volecity

最新推荐文章于 2024-03-07 17:02:51 发布

阅读量425

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签：开发语言

本文链接：https://blog.youkuaiyun.com/start7000k/article/details/126384558

javascript 专栏收录该内容

10 篇文章

订阅专栏

本文详细解析axios中的.catch语句在JavaScript中的作用，探讨了六种原生错误类型和自定义错误类型，以及其在捕获跨域和异步错误上的局限性。通过实例说明try-catch的使用和常见错误类型处理技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言：忽然想起来axios中的.catch

js是运行时报错为什么请求接口报错后页面没有阻塞那就是因为用了 try catch错误捕获语句

先看语法

try {
    tryCode - 尝试执行代码块
}
catch(err) {
    catchCode - 捕获错误的代码块
}
finally {
    finallyCode - 无论 try / catch 结果如何都会执行的代码块
}

1.错误类型

1.1 原生的错误类型

js 代码在运行时可能产生的错误错误共有 6 种类型：

语法错误（SyntaxError）；
类型错误（TypeError）；
范围错误（RangeError）；

eval 错误（EvalError）；
    使用 eval 操作时，即使不正当的错误
    （eval() 函数计算 JavaScript 字符串，并把它作为脚本代码来执行。
    如果参数是一个表达式，eval() 函数将执行表达式。如果参数是Javascript语句，eval()将执行         
    Javascript 语句。）
引用错误（ReferenceError）；
URI 错误（URIError）；
    操作url报错 encodeURI(), decodeURI()

这些错误类型都继承自Error类。

1.2 自定义错误类型

自定义一些错误类型，通过这些错误类型，就能看出是某个模块抛出的错误

class FingerError extends Error {
  constructor(message) {
    super(message);
    this.name = 'FingerError'; // 该错误的名称
    Error.captureStackTrace(this, this.constructor); // 获取错误堆栈的信息
  }
}

const err = new FingerError('get name error');
console.error(err); // FingerError: get name error
err instanceof FingerError; // true

2.1 缺点

不能捕获：跨域错误异步错误

饮水思源：前端中 try-catch 捕获不到哪些异常和错误 - 知乎