10秒钟内说出js中有哪些内置错误类型

简介: 如果现在立刻让你回答,说下你了解的js中有哪些错误类型?能说出几个?日常开发中,我们会碰到各种各样的js报错信息。大部分情况,我们只要看到控制台有飘红,就知道代码执行有问题。但是这些错误都有哪些类型?可能没有太关注过,如果我们知道了这些错误类型出现的场景,那是不是对我们定位问题有所帮助,甚至能提高我们以后的代码质量。

如果现在立刻让你回答,说下你了解的js中有哪些错误类型?能说出几个?

日常开发中,我们会碰到各种各样的js报错信息。大部分情况,我们只要看到控制台有飘红,就知道代码执行有问题。但是这些错误都有哪些类型?可能没有太关注过,如果我们知道了这些错误类型出现的场景,那是不是对我们定位问题有所帮助,甚至能提高我们以后的代码质量。

基类 Error


Error是基类型,其他内置错误类型都是继承该类型,因此所有内置错误类型都是共享相同的属性(所有错误对象上的方法都是这个默认类型定义的方法)。

浏览器很少会抛出Error类型的错误,该类型主要用于抛出自定义错误。

构造函数

//创建一个错误
new Error([message[, fileName[,lineNumber]]]) //参数均为可选

实例上有哪些属性?

30ca7c175c597c2a708128227f6fcaef_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

内置错误类型1 :ReferenceError(引用错误)

常见指数:🌟🌟🌟🌟🌟   不夸张的说,线上80%错误都是这个

表示引用错误,使用了未声明的变量。

错误之前的代码会执行,之后代码不会执行。

使用未声明的变量

a0ebfd53c5d257f3b460b370519bf7f4_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

把变量赋值给一个无法赋值的xx

表示:左侧的赋值无效

aecad208dbdd30ae1ba6e1c5fa49acb1_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

捕获一个错误

try {
  var a = undefinedVariable;
} catch (e) {
  console.log(e instanceof ReferenceError); // true
  console.log(e.message);                   // "undefinedVariable is not defined"
  console.log(e.name);                      // "ReferenceError"
  console.log(e.fileName);                  // "Scratchpad/1"
  console.log(e.lineNumber);                // 2
  console.log(e.columnNumber);              // 6
  console.log(e.stack);                     // "@Scratchpad/2:2:7\n"
}

新建错误

try {
  throw new ReferenceError('Hello', 'aaa.js', 10);
} catch (e) {
  console.log(e instanceof ReferenceError); // true
  console.log(e.message);                   // "Hello"
  console.log(e.name);                      // "ReferenceError"
  console.log(e.fileName);                  // "aaa.js"
  console.log(e.lineNumber);                // 10
  console.log(e.columnNumber);              // 0
  console.log(e.stack);                     // "@Scratchpad/2:2:9\n"
}

内置错误类型2:RangeError

常见指数:⭐⭐⭐ 说实话,不太常见,但很容易构造

会在数值越界时抛出.例如,定义数组时如果设置了不支持的长度,如-1,又或者没有给递归设置停止条件时触发。

该类型在JavaScript发生不多。

98f511d46271f9ddee8c06319158cdc3_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

7bc54f89793fb128bbfc7e74af96a0c9_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

超过数组最大长度限制

06188ca95d165bf3b69e74a3eeea81e2_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

自定义RangeError错误

var check = function(num) {
  if (num < MIN || num > MAX) {
    throw new RangeError('Parameter must be between ' + MIN + ' and ' + MAX);
  }
};
try {
  check(500);
}
catch (e) {
  if (e instanceof RangeError) {
    // 处理越界错误
  }
}

内置错误类型3:TypeError

常见指数:⭐⭐⭐⭐ 使用ts之前可能会有,ts之后应该能干掉一大部分

TypeError在JavaScript中很常见,主要发生变量在运行时的访问不是预期类型,或者访问不存在的方法时,尤其是在使用类型特定的操作而变量类型不对时。

在给函数传参前没有验证的情况下,错误发生较多。

比如a变量是个基本类型,却被当做函数调用

54b8bb9c7f252d5ebd41aed289709484_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

比如访问不存在的方法

933619a5deb7abd6ec02574460df81f5_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

内置错误类型4:SyntaxError

常见指数:⭐⭐⭐⭐⭐ 太常见了,一般的在开发环境,调试的时候

这是最常见的错误。当我们输入 JS 引擎不能理解的代码时,就会发生这个错误。

JS 引擎在解析期间会捕获了这个错误,而不是运行时。

1a6182b4d58b99d6eb8149df9146864c_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

或者给eval()传入的字符串包含JavaScript语法错误时,也会抛出此异常

ec076686fc7540d222aa903cd4869879_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png


内置错误类型5:URIError

常见指数:⭐ 很少见

URIError只会在使用encodeURL()或decodeURL()时,传入了格式错误的URL时发生,但非常罕见,因为上面两个函数非常稳健.

比如对空格进行编码,然后把编码的结果改为非法的结果,对该结果再进行解码,就会抛出异常

5b6b92d37bf9c1ea7408955b8640bee9_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png


内置错误类型6:EvalError

常见指数:0 稀有

会在使用eval()函数发生异常时抛出。

EvalError 不在当前ECMAScript规范中使用,因此不会被运行时抛出. 但是对象本身仍然与规范的早期版本向后兼容.

以下来自mdn

d541f7bd162b20dc3bafaa5fadab2ed6_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

内置错误类型7:InternalError

常见指数:0 稀有

表示出现在JavaScript引擎内部的错误。

例如,递归过多导致了栈溢出.这类型并不是代码中通常要处理的错误,如果真的发生了这种错误,很可能代码哪里搞错了或者有危险.

但事实证明递归过多导致栈溢出报的是RangeError。

d663c7c13bfac2ca2df0119afd11ed4b_640_wx_fmt=png&wxfrom=5&wx_lazy=1&wx_co=1.png

目录
相关文章
|
3月前
|
JavaScript
常见函数的4种类型(js的问题)
常见函数的4种类型(js的问题)
26 0
|
3月前
|
JavaScript 前端开发
JavaScript 中如何检测一个变量是一个 String 类型?
JavaScript 中如何检测一个变量是一个 String 类型?
41 2
|
16天前
|
前端开发 JavaScript 搜索推荐
Next.js 适合什么类型的项目开发?
【8月更文挑战第4天】Next.js 适合什么类型的项目开发?
35 3
|
2月前
|
JavaScript 前端开发
JavaScript中的布尔类型与数字类型详解
JavaScript中的布尔类型与数字类型详解
22 0
|
3月前
|
JavaScript 前端开发 安全
使用TypeScript增强JavaScript应用的类型安全性
【5月更文挑战第23天】TypeScript是微软开发的JavaScript超集,引入静态类型检查和面向对象特性,提升代码可维护性和可靠性。它在编译阶段捕获类型错误,增强代码可读性,并通过接口、类、泛型和类型断言等工具确保类型安全。使用TypeScript能有效避免复杂项目中的调试难题,尤其适合大型项目。
|
9天前
|
JavaScript 前端开发
在JavaScript如何确认数据的类型?
# `typeof` 与 `instanceof` 数据类型判断 `typeof` 操作符用于确定变量的基本数据类型,例如: - "string" - "number" - "boolean" - "undefined" 但对于引用类型如对象和数组,包括 `null`,它返回 "object"。 `instanceof` 用于检查对象是否为特定构造函数的实例,返回布尔值。它能准确识别数组等复杂类型,通过检查对象的原型链来确定其是否属于某个构造函数的实例。 两者结合使用可全面判断数据类型。
18 2
|
5天前
|
JavaScript 前端开发
javascript 异常问题之JavaScript中的异常有哪些类型,可以举例说明吗
javascript 异常问题之JavaScript中的异常有哪些类型,可以举例说明吗
|
2月前
|
JavaScript 前端开发
JS的静态类型检测,有内味儿了
JS的静态类型检测,有内味儿了
|
2月前
|
存储 JavaScript 前端开发
JavaScript中的对象是数据结构,存储键值对,键为字符串,值可为任意类型,包括函数(作为方法)
【6月更文挑战第25天】JavaScript中的对象是数据结构,存储键值对,键为字符串,值可为任意类型,包括函数(作为方法)。
29 2
|
2月前
|
前端开发 JavaScript 安全
TypeScript作为一种静态类型的JavaScript超集,其强大的类型系统和面向对象编程特性为微前端架构的实现提供了有力的支持
【6月更文挑战第11天】微前端架构借助TypeScript提升开发效率和代码可靠性。 TypeScript提供类型安全,防止微前端间通信出错;智能提示和自动补全加速跨代码库开发;重构支持简化代码更新。通过定义公共接口确保一致性,用TypeScript编写微前端以保证质量。集成到构建流程确保顺利构建打包。在微前端场景中,TypeScript是强有力的语言选择。
38 2

热门文章

最新文章