javascript技巧

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript技巧 > JS Error错误对象用法

JS对象类型之Error错误对象的用法详解

作者:儒雅的烤地瓜

error对象是JavaScript的原生对象,当程序解析和运行过程中发生了错误,JS引擎就会自动产生并抛出一个error对象的实例,并且程序会终止在错误发生的地方,本文给大家介绍了JS Error错误对象的用法,需要的朋友可以参考下

error对象是JavaScript的原生对象,当程序解析和运行过程中发生了错误,JS引擎就会自动产生并抛出一个error对象的实例,并且程序会终止在错误发生的地方。

ECMA-262 规定error对象包含 message 和 name 两个属性,message属性保存错误信息,name属性保存错误类型。

可以使用error()构造函数创建一个新的Error错误对象,对象接收一个参数用来表示错误信息,error对象会把它作为message属性的值;如果没有参数,它将使用一个预定义的默认字符串作为属性值

new Error()
new Error('错误消息')
 
// 可以省略new操作符
Error()
Error('错误消息')
 
// 通常使用throw语句来抛出错误
throw Error('错误消息')
throw Error()

error对象有一个toString()方法。返回'Error' + message属性值

error类型

ECMA-262 定义了下列7种错误类型:

Error()     // 基类型
EvalError()  // eval错误
RangeError() // 范围错误
ReferenceError() // 引用错误
SyntaxError() // 语法错误
TypeError()  // 类型错误
URIError() // URI错误

Error 是基类型,其他错误类型都继承自该类型,可以利用它抛出自定义错误。

以下6种错误类型都是Error对象的派生对象。在JavaScript中,数组array、函数function都是特殊的对象

EvalError()

eval()函数执行出错时会抛出EvalError错误,该类型在ES5中已不再出现,为了向后兼容,所以被保留了下来。

// Uncaught TypeError: eval is not a constructor
new eval()
// 不会报错
eval = () => {}

RangeError()

RangeError是一个值超过有效范围时,会抛出RangeError范围错误。例如设置数组的长度为一个负值。

// 数组长度不得为负数
new Array(-1) // Uncaught RangeError: Invalid array length

ReferenceError()

ReferenceError是引用一个不存在的变量或左值时,会抛出ReferenceError引用错误

a; // Uncaught ReferenceError: a is not defined

SyntaxError()

SyntaxError是代码解析时会抛出SyntaxError语法错误(语法不符合规则)。

示例1

var 1bar = 1; // SyntaxError: Invalid or unexpected token

 示例2

function fn() {
    // Uncaught SyntaxError: Unexpected token '}'
    var a = 
}
 
fn();

TypeError()

执行某些操作时,类型不符合要求会导致TypeError类型错误

null.toString() // Uncaught TypeError: Cannot read property 'toString' of null

URIError()

URIError是指调用URI相关函数的参数不正确时会发生URIError错误,例如,调用decodeURI 、encodeURI、decodeURIComponent、encodeURIComponent、escape、unescape时发生的错误。

decodeURI('%2') // Uncaught URIError: URI malformed at decodeURIComponent 

error事件

任何没有通过 try catch 处理的错误都会触发window对象的error事件。error事件接收五个参数:

message:错误信息(字符串)
source:发生错误的脚本URL(字符串)
lineno:发生错误的行号(数字)
colno:发生错误的列号(数字)
error:Error对象(对象)
// 示例1 DOM0级
window.onerror = function(message, source, lineno){
   console.log(message, source, lineno)
}
 
// 示例2 DOM2级
window.addEventListener('error', function(event){
    console.log(event.message, event.source, event.lineno)
});

图像也支持error事件,当图像src属性的url不能返回可以识别的图像格式时,就会触发error事件。error事件发生时图片下载已结束。

var img = new Image()
img.src='a.jpg'
img.onerror = function(e) {
  console.log(e)
}

throw语句

throw语句用于抛出错误,后面必须指定一个值用来表示错误信息,值的类型没有要求。

参考:throw - JavaScript | MDN

throw 语句用来抛出一个用户自定义的异常。当前函数的执行将被停止(throw之后的语句将不会执行),并且控制将被传递到调用堆栈中的第一个catch块。如果调用者函数中没有catch块,程序将会终止。

throw 'hello world';
 
throw new Error('something bad happened');
 
throw new SyntaxError('I don\'t like your syntax.');
throw new TypeError('what type of variable do you take me for?');
throw new RangeError('sorry,you just don\'t have the range.');
throw new EvalError('That doesn\'t evaluate.');
throw new URIError('URI, is that you?');
throw new ReferenceError('you didn\'t cite your references properly');

可以利用原型链继承Error对象创建自定义错误。

function CustomError(message) {
	this.name = 'CustomError'
	this.message = message
}
 
CustomError.prototype = new Error()
throw new CustomError('custom error')

try...catch...语句

try...catch的作用是将可能引发错误的代码放在try块中,在catch中捕获错误,对错误进行处理,选择是否往下执行。

try-catch 语句用于捕获和处理JavaScript中的异常,try从句定义了可能出现异常的代码块,catch从句定义当try从句抛出异常时执行的代码。try从句中的任何代码抛出异常,都会导致代码终止执行,然后执行catch中的代码。

catch从句后面还可以跟finally从句,用于放置清理代码。无论try从句是否抛出错误,finally从句中的代码都会执行。catch和finally都是可选的,但是try从句至少要和其中一个组合成完整的语句。

try {
  // 这里可能会产生错误,可能是程序错误,可能是throw语句抛出的错误
}catch(e) {
  // 当try中抛出错误时这里才执行,变量e包含了错误信息
  // 可以根据错误类型处理错误,也可以再次抛出错误
}finally{
  // 无论try是否抛出异常,这里代码正常执行。即使try中出现return语句。
}
function fn() {
  try {
    console.log(0);
    throw 'bug';
  } catch(e) {
    console.log(1);
    return true;
  } finally {
    console.log(2);
    return false; // 这句会覆盖掉前面的return
  }
  console.log(3); // 不会运行
}
var result = fn();
// 0
// 1
// 2
 
console.log(result) // false

● try 代码块中的错误,会被catch捕获,如果没有手动抛出错误,不会被window捕获 

try {
  throw new Error('出错了!');
} catch (e) {
  console.dir(e);
  throw e
}

运行结果:

注意:在catch中抛出异常, 用 throw e,不要用throw new Error(e),因为e本身就是一个Error对象了(因为在try代码快中使用throw抛出的 new Error(),是一个使用构造函数new Error()创建的错误实例对象),具有错误的完整堆栈信息stack,new Error 会改变堆栈信息,将堆栈定位到当前这一行。

● try...finally... 不能捕获错误

下面的代码,由于没有catch,错误会直接被window捕获。

try {
    throw new Error('出错啦啦啦')
} finally {
    console.log('啦啦啦')
}

运行结果:

try...catch...只能捕获同步代码的错误, 不能捕获异步代码错误。

下面的代码,错误将不能被catch捕获

try {
    setTimeout(() => {
        throw new Error('出错啦!')
    })
} catch(e){
    // 不会执行
    console.dir(e)
}

因为setTimeout是异步任务,里面回调函数会被放入到宏任务队列中,catch中代码块属于同步任务,处于当前的事件队列中,会立即执行。当setTimeout中回调执行时, try/catch中代码块已不在堆栈中,所以错误不能被捕获。

以上就是JS对象类型之Error错误对象的用法详解的详细内容,更多关于JS Error错误对象用法的资料请关注脚本之家其它相关文章!

您可能感兴趣的文章:
阅读全文