究竟 javascript 错误处理有哪些类型?
有时候,在自己封装的工具函数中,不传参或传入了错误类型的参数,也要适当的抛出一些错误以示警告;使用框架不正常情况下也会抛出错误,如果对错误一无所知,便无从下手调试。综合上述,了解错误的处理机制是多么必要。
以下是笔者归纳总结,如有误之处,欢迎指出。
错误构造函数
javascript规范中总共有8中错误类型构造函数
Error -- 错误对象
SyntaxError --解析过程语法错误
TypeError -- 不属于有效类型
ReferenceError -- 无效引用
RangeError -- 数值超出有效范围
URIError -- 解析URI编码出错
EvalError -- 调用eval函数错误
InternalError -- Javascript引擎内部错误的异常抛出, "递归太多"
其中两种做个特殊说明:
EvalError调用eval函数错误,已经弃用,为了向后兼容,低版本还可以使用。
InternalError 递归过深 抛出错误,多数浏览器未实现,属于非标准方法,生产环境禁用
继承关系
Error是错误的基类,其他类型都继承Error这个类,可以使用ES6中提供的Object.getPrototypeOf()来判断,一个类是否继承了另一个类。
console.log(Object.getPrototypeOf(SyntaxError) === Error); // true console.log(Object.getPrototypeOf(TypeError) === Error); // true console.log(Object.getPrototypeOf(RangeError) === Error); // true console.log(Object.getPrototypeOf(URIError) === Error); // true console.log(Object.getPrototypeOf(EvalError) === Error); // true console.log(Object.getPrototypeOf(ReferenceError) === Error); // true
来聊一聊每一种错误类型的使用和出错的场景。
Error
通过Error的构造器可以创建一个错误对象。当运行时错误产生时,Error的实例对象会被抛出。
语法:new Error([message])
参数:
message 可选,错误描述信息。
抛出错误
使用throw语句来抛出异常
throw new Error('这里抛出的是错误信息')
运行后,会在控制台打印输出:
Uncaught Error: 这里抛出的是错误信息
注意: 使用 throw 抛出异常后,之后的代码不再执行。
捕获错误
可以通过try{}catch(){}语句来捕获到这个错误
try{ throw new Error('这里抛出的是错误信息')
}catch(err){
alert(err.name + ' '+ err.message)
}
属性说明:
当使用new Error创建错误实例后,会有两个属性:
let e = new Error('这里抛出的是错误信息');
name属性,为错误的类型,此时为Error
message属性,为错误的信息,此时为'这里抛出的是错误信息'
SyntaxError
解析过程语法错误,这种类型抛出的错误有很多,往往是书写时候造成的语法错误,例如:
let n = 1\1; // Uncaught SyntaxError: Invalid or unexpected token
let str = "hel"lo" // Uncaught SyntaxError: Unexpected identifier
let 123Var = 'hi' // Uncaught SyntaxError: Invalid or unexpected token
语法错误有很多就不一一列举了,当在浏览器运行时,控制台会抛错,并且告知第几行,所以调试器来比较方便。但要读懂错误的类型为SyntaxError,以及后面的错误信息,这样方便改错。
TypeError
不属于有效类型。这种错误就是在给的不是需要的类型而导致无法操作,会抛出类型错误。
变量或参数不是预期类型,
变量或参数不是预期类型
例如**new**运算符后必须是函数,而给定的不是函数,则会抛出类型错误
let fn = 'hello';
new fn;
抛出错误:
Uncaught TypeError: fn is not a constructor
调用对象不存在的方法
let obj = {};
obj.fn()
抛出错误:
Uncaught TypeError: obj.fn is not a function
当然你也可以在封装函数时候,强制传入的参数为指定类型,否则抛出类型错误。
function flatten(arr){ if( !Array.isArray(arr) ){ throw new TypeError('传入参数不是数组')
}
}
flatten('test');
传入的参数不为数组时,抛出自定义的类型错误:
Uncaught TypeError: 传入参数不是数组
ReferenceError
无效引用。
引用了一个不存在的变量
console.log(a);
抛出错误
Uncaught ReferenceError: a is not defined
将变量赋值给一个无法被赋值的数据
这个错误常常犯的地方实在调用一个方法后在if语句中做判断,将比较运算符==写成了赋值运算符=,例如判断一个字符串第一个字符是不是指定的字符:
let str = 'hello';if( str.charAt(0) = 'h' ){
console.log('第一个字符为h');
}
抛出错误:
Uncaught ReferenceError: Invalid left-hand side in assignment
RangeError
数值超出有效范围。在一些方法中,传入的数值必须在一定的范围内,否则会抛出超出范围的错误。
创建数组传入的长度小于了0
let arr = new Array(-1)
抛出错误:
Uncaught RangeError: Invalid array length
repeat方法重复指定的字符串重复次数小于0
let str = 'hello';
str.repeat(-1)
抛出错误:
Uncaught RangeError: Invalid count value
URIError
处理URI编码出错。函数参数不正确,主要是encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。
例如:
decodeURIComponent('%');
decodeURI('%2')
抛出错误:
Uncaught URIError: URI malformed
自定义错误类型
有时候希望自定义错误类型,需要自定义一个构造函数,然后让原型继承继承Error.prototype即可。
function MyErrorType(message){
this.message = message || '错误';
this.name = 'MyErrorType';
this.stack = (new Error()).stack; // 错误位置和调用栈
}
MyErrorType.prototype = Object.create(Error.prototype);
MyErrorType.prototype.constructor = MyErrorType;
throw new MyErrorType('自定义错误类型抛出错误')
关于调用的错误栈信息
提供的错误的跟踪功能,以什么样的调用顺序,在哪个文件的哪一行捕获到这个错误。
例如以下调用:
function trace() {
try {
throw new Error('myError');
}
catch(e) {
console.log(e.stack);
}
}
function b() {
trace();
}
function a() {
b(3, 4, '\n\n', undefined, {}); }
a('first call, firstarg');
错误信息为:
Error: myError
at trace (<Error.html>:3:14)
at b (<Error.html>:10:6)
at a (<Error.html>:13:6)
at <Error.html>:15:4
以上为抛错的构造函数的总结,如有误之处欢迎扶正。
以上每一种错误场景并没有列出太多,如果你有新的错误信息发现,欢迎留言讨论。
究竟 javascript 错误处理有哪些类型?的更多相关文章
- javascript 核心语言笔记- 3 - 类型、值和变量
JavaScript 中的数据类型分为两类:原始类型(primitive type)和对象类型(object type).原始类型包括数字.字符串和布尔值 JavaScript 中有两个特殊的原始值: ...
- 01.JavaScript 面向对象精要--原始类型和引用类型
一.什么是类型 JavaScript 虽然没有类的概念.但依然存在两种类型:原始类型和应用类型. 原始类型保存为简单的数据值,引用类型则保存为对象,其本质是指向内存位置 的引用.也就是说:原始值被直接 ...
- javascript错误处理与调试(转)
JavaScript 在错误处理调试上一直是它的软肋,如果脚本出错,给出的提示经常也让人摸不着头脑. ECMAScript 第 3 版为了解决这个问题引入了 try...catch 和 throw 语 ...
- JavaScript错误处理
JavaScript 错误 - Throw.Try 和 Catch JavaScript 测试和捕捉 try 语句允许我们定义在执行时进行错误测试的代码块. catch 语句允许我们定义当 try 代 ...
- 第一百二十三节,JavaScript错误处理与调试
JavaScript错误处理与调试 学习要点: 1.浏览器错误报告 2.错误处理 3.错误事件 4.错误处理策略 5.调试技术 6.调试工具 JavaScript在错误处理调试上一直是它的软肋,如果脚 ...
- 1000多个项目中的十大JavaScript错误以及如何避免
通过统计数据库中的1000多个项目,我们发现在 JavaScript 中最常出现的错误有10个.下面会向大家介绍这些错误发生的原因以及如何防止. 对于这些错误发生的次数,我们是通过收集的数据统计得出的 ...
- 【转】Javascript错误处理——try…catch
无论我们编程多么精通,脚本错误怎是难免.可能是我们的错误造成,或异常输入,错误的服务器端响应以及无数个其他原因. 通常,当发送错误时脚本会立刻停止,打印至控制台. 但try...catch语法结构可以 ...
- 【转】JavaScript 错误处理与调试——“错误处理”的注意要点
try-catch语句 该语句最适合处理那些我们无法控制的错误,在明明白白地知道自己的代码会发生错误时,再使用该语句就不太合适了. ECMA-262第3版引入了try-catch语句,基本的语法如下所 ...
- C#保留2位小数几种场景总结 游标遍历所有数据库循环执行修改数据库的sql命令 原生js轮盘抽奖实例分析(幸运大转盘抽奖) javascript中的typeof和类型判断
C#保留2位小数几种场景总结 场景1: C#保留2位小数,.ToString("f2")确实可以,但是如果这个数字本来就小数点后面三位比如1.253,那么转化之后就会变成1.2 ...
随机推荐
- hadoop挂载多硬盘,ZZ-- multiple disks per node
hadoop挂载多硬盘 ...multiple disks per node multiple disks per node Read more at: http://www.queryhome.c ...
- caffe---mnist数据集训练与测试
1.数据.mnist_test_lmdb和mnist_train_lmdb数据 2.路径. (1)修改lenet_train_test.prototxt文件,训练和测试两处 source: " ...
- laravel调度任务
<?php namespace App\Console; use Illuminate\Console\Scheduling\Schedule;use Illuminate\Foundation ...
- JSX语法
什么是JSX语法:就是符合 xml 规范的 JS 语法:(语法格式相对来说,要比HTML严谨很多) 1. 如何启用 jsx 语法? 安装 `babel` 插件 - 运行`cnpm i babel-co ...
- 牛客挑战赛 30 A 小G数数
题目链接:https://ac.nowcoder.com/acm/contest/375/A 分析:我写的时候竟然把它当成了DP....... 还建了个结构体DP数组,保存一二位,不知道当时脑子在抽啥 ...
- SQLServer2012数据库降级至SQLServer2008R2的方法
一. 背景 因为对方的客户的服务器安装的数据版本2012,公司开发同事需要客户数据库的备份数据,但是公司数据版本是2008R2的,无法还原. 由于2012备份无法直接还原至2008R2(MSSQ ...
- bzoj4804: 欧拉心算 欧拉筛
题意:求\(\sum_{i=1}^n\sum_{j=1}^n\phi(gcd(i,j))\) 题解:\(\sum_{i==1}^n\sum_{j=1}^n\sum_{d=1}^n[gcd(i,j)== ...
- js操作字符串的常用方法
使用 substring()或者slice() 函数:split() 功能:使用一个指定的分隔符把一个字符串分割存储到数组 例子: str=”jpg|bmp|gif|ico|png”; arr=the ...
- 使用INTERSECT运算符
显示符合以下条件的雇员的雇员ID 和职务ID:这些雇员的当前职务与以前的职务相同,也就是说这些雇员曾担任过别的职务,但现在又重新担任了以前的同一职务. hr@TEST0924> SELECT e ...
- Linux安装配置samba教程(CentOS 6.5)
一.服务端安装配置samba 1.1 服务端安装samba yum install -y samba 1.2 创建共享目录并写入配置文件 以/samba为共享目录为例,为了更直观地观测我们在该目录中创 ...