简介JavaScript错误处理机制
1、 try-catch语句
ECMA-262第3版引入了try-catch语句，作为JavaScript中处理异常的一种标准方式。
语法：
try{
// 可能会导致错误的代码
}catch (error){
// 在错误发生时怎么处理
}
也就是说，我们应该把所有可能会抛出错误的代码都放在try语句块中，而把那些用于错误处理代码放在catch块中。
try-catch语句的逻辑是：如果try块中的任何代码发生了错误，就会立即退出代码执行过程，然后接着执行catch块。此时，catch块会接收到一个包含错误信息的对象。
注意：即使你不想使用这个错误对象，也要给它起个名字。
虽然这个对象在不同浏览器中可能包含不同信息，但是都有一个保存着错误消息的message属性，还有一个保存错误类型的name属性（并不是所有浏览器都有）
try{
}catch (error){
console.log(error.message);
}
在跨浏览器编程时，最好还是只使用message属性。
1.1 finally子句
当使用finally子句时，其代码无论如何都会执行，也就是说，不管是正常执行还是出错了，finally子句都会执行。甚至return语句，也不会阻止finally子句的执行。
看下面的例子：
function test(){
try{
console.log('a');
return 2;
}catch(error){
console.log('b');
}finally{
console.log('c');
}
}
console.log(test());
//结果
a
c
2
从运行结果，我们可以看到，return语句并没有阻止finally子句的执行，而且是在finally子句执行后才会返回return语句的值。
2、错误类型
执行代码期间可能会发生的错误有多种类型。每种错误都有对应的错误类型，而当错误发生时，会抛出相应类型的错误对象。
ECMA-262定义了下列7中错误类型：
Error
EvalError
RangeError
ReferenceError
SyntaxError
TypeError
URIError
Error是基类型，其他错误类型都继承自该类型。所有错误类型共享了一组相同的属性。
（1）EvalError类型
EvalError类型的错误会在使用eval()函数而发生异常时抛出。简单的说，如果没有把eval()当成函数调用，就会抛出异常。比如：
new eval() // 抛出EvalError eval = foo; // 抛出EvalError
注意：在ES5中已经不在出现了。
（2）RangeError类型
RangeError类型的错误会在数值超出相应范围时触发。主要有几种情况，一是数组长度为负数，二是Number对象的方法参数超出范围，以及函数堆栈超过最大值。
var item = new Array(-20); // 抛出RangeError异常
（3）ReferenceError类型
在找不到对象的情况下，会发生ReferenceError。通常，在访问不存在的变量时，就会发生这种错误。
var obj = x; // 在x并未声明的情况下抛出ReferenceError
（4）SyntaxError类型
SyntaxError是解析代码时发生的语法错误。
var 1a; // 变量名错误，抛出SyntaxError
（5）TypeError类型
在变量中保存着意外的类型，或在访问不存在的方法时，都会导致这种错误。
var o = new 10; //抛出TypeError
（6）URIError类型
URIError是URI相关函数的参数不正确时抛出的错误，主要涉及encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。
2.2 抛出错误
与try-catch语句相配的还有一个throw操作符，用于随时抛出自定义错误。抛出错误时，必须要给throw操作符指定一个值，这个值可以是任何类型。
throw 1;
throw 'tg';
throw true;
throw {name: 'tg'};
2.3 Error对象
所有抛出的错误都是Error构造函数的实例。Error构造函数接受一个参数，表示错误提示，可以从实例的message属性读到这个参数。
在JavaScript中，Error对象的实例必须有message属性，表示出错时的提示信息。在大多数JavaScript引擎中，Error实例还可能有name和stack属性，分别表示错误的名称和错误的堆栈。
var err = new Error('出错了');
err.message; // "出错了"
2.4 自定义错误
我们还可以创建自定义错误消息，最常用的错误类型是Error、RangeError、ReferenceError和TypeError。
throw new Error('报错了');
throw new RangeError('数组长度错误');
另外，利用原型链还可以通过继承Error来创建自定义错误类型：
function CustomError(message){
this.name = 'CustomError';
this.message = message;
}
CustomError.prototype = new Error();
throw new CustomError('我的错误信息');
3、错误（error）事件
任何没有通过try-catch处理的错误都会触发window对象的error事件。
onerror事件处理程序不会创建event对象，但它接受三个参数：错误消息、错误所在的URL和行号。
window.onerror = function(message, url, line){
};
当你在事件处理程序中返回false，可以阻止浏览器报告错误的默认行为
window.onerror = function(message, url, line){
return false;
};
4、调试技术
4.1 alert方法
在以前，大多数都是在要调试的代码中插入alert()函数，看是否执行到这一步来判断哪里出错，这种方式比较麻烦，因为alert()会阻止后续代码的执行（除非你关闭了alert弹窗），而且调试后还要清理。
4.2 console
随着浏览器的不断改善，现在的浏览器都有JavaScript控制台，我们可以向这些控制台输出消息，比如最常用的console对象，它的常用方法如下：
- error(message)：将错误消息记录到控制台
- info(message)：将信息性消息记录到控制台
- log(message)：将一般消息记录到控制台
- warn(message)：将警告消息记录到控制台
function test(){
console.log('结果：' + (1 + 2));
}
4.3 throw
使用throw抛出错误。
以上就是简介JavaScript错误处理机制的详细内容，更多关于JavaScript错误处理机制的资料请关注我们其它相关文章！
相关推荐
-
javascript 小数乘法结果错误的处理方法
一.用js计算 12.32 * 7 结果是多少? 答案:86.24000000000001 为什么会出现这种问题?怎么解决? js在处理小数的乘除法的时候有一个bug,解决的方法可以是:将小数变为整数来处理. 以上的计算可以改为: 12.32 * 100 * 7 /100 得出的结果是:86.24,正确. 另外再计算一下: 8.80 * 100 * 12 / 100 结果:105.60000000000002 38.80也会出现类似的问题. 精确度增加10倍: 8.80 * 100
-
浅谈如何优雅处理JavaScript异步错误
1. try/catch try/catch基本上是大家最常和async/await一起使用的,基本上我们会用它去包围大部分的异步方法.await关键字后面的promise一旦reject了,就会抛出一个异常错误. run(); async function run() { try { await Promise.ject(new Error('Oops!')); } catch (err) { console.error(error.message); } } try/catch同样也可以处理
-
laravel 错误处理,接口错误返回json代码
Laravel 默认已经为我们配置好了错误和异常处理,我们在 App\Exceptions\Handler 类中触发异常并将响应返回给用户. 所有异常都由类App\Exceptions\Handler处理,该类包含两个方法:report和render report方法只是将异常传递给异常被记录的基类,我们这里主要是针对 render 的修改: 先看代码: public function render($request, Exception $exception) { if($request->i
-
NodeJS处理Express中异步错误
摘要 比起回调函数,使用 Promise 来处理异步错误要显得优雅许多. 结合 Express 内置的错误处理机制和 Promise 极大地降低产生未捕获错误(uncaught exception)的可能性. Promise 在ES6中是默认选项.如果使用 Babel 转译,它也可以与 Generators 或者 Async/Await 相结合. 本文主要阐述如何在 Express 中使用错误处理中间件(error-handling middleware)来高效处理异步错误.在 Github 上
-
JavaScript错误处理和堆栈追踪详解
有时我们会忽略错误处理和堆栈追踪的一些细节, 但是这些细节对于写与测试或错误处理相关的库来说是非常有用的. 例如这周, 对于 Chai 就有一个非常棒的PR, 该PR极大地改善了我们处理堆栈的方式, 当用户的断言失败的时候, 我们会给予更多的提示信息(帮助用户进行定位). 合理地处理堆栈信息能使你清除无用的数据, 而只专注于有用的数据. 同时, 当更好地理解 Errors 对象及其相关属性之后, 能有助于你更充分地利用 Errors. (函数的)调用栈是怎么工作的 在谈论错误之前, 先要了解下(
-
JavaScript错误处理操作实例详解
本文实例讲述了JavaScript错误处理操作.分享给大家供大家参考,具体如下: 良好的错误处理机制可以让用户得到及时的提醒,所以让我们来看看 JavaScript 提供了哪些针对错误处理的工具和方法吧O(∩_∩)O~ 1 try-catch 语句 ECMA-262 第 3 版引入了 try-catch 语句,这时 JavaScript 处理异常的标准方式: try{ //可能会导致错误的代码 } catch (error){ //错误处理 } 如果 try 块中的代码发生了错误,会立即执行 c
-
深入分析javascript中的错误处理机制
前面的话 错误处理对于web应用程序开发至关重要,不能提前预测到可能发生的错误,不能提前采取恢复策略,可能导致较差的用户体验.由于任何javascript错误都可能导致网页无法使用,因此作为开发人员,必须要知道何时可能出错,为什么会出错,以及会出什么错.本文将详细介绍javascript中的错误处理机制 error对象 error对象是包含错误信息的对象,是javascript的原生对象.当代码解析或运行时发生错误,javascript引擎就会自动产生并抛出一个error对象的实例,然后整个程序
-
JS常见错误(Error)及处理方案详解
1. 错误的类型 Error: 所有错误的父类型 错误的子类型包括: ReferenceError: 引用的变量不存在 TypeError: 数据类型不正确的错误 RangeError: 数据值不在其所允许的范围内 SyntaxError: 语法错误 常见的内置错误: (1)ReferenceError: 引用变量不存在 console.log(a) //ReferenceError: a is not defined (2)TypeError: 数据类型不正确 var b = {} b.xxx
-
javascript容错处理代码(屏蔽js错误)
有时候大家来浏览网页的时候发现IE浏览器左下角总有个黄色错误标志,有时候更是直接弹出错误无法继续浏览页面,这样对于网站的正规性与权威性发展不利. 国外银行页面就是因为这样的错误,导致用户大量流失不敢用这个银行的网上银行等导致损失惨重. 所以一个想要在用户体验与公司实力上都是不容出现的错误,就是不影响使用也不能让用户反感,我们一直致力于为大家提高更好的代码,所以这里我们将会大家整理一些常用的代码,使用方法什么,希望大家以后能越来越支持我们,让我们共同发展. 第一种:我们在用的 <SCRIPT la
-
简介JavaScript错误处理机制
1. try-catch语句 ECMA-262第3版引入了try-catch语句,作为JavaScript中处理异常的一种标准方式. 语法: try{ // 可能会导致错误的代码 }catch (error){ // 在错误发生时怎么处理 } 也就是说,我们应该把所有可能会抛出错误的代码都放在try语句块中,而把那些用于错误处理代码放在catch块中. try-catch语句的逻辑是:如果try块中的任何代码发生了错误,就会立即退出代码执行过程,然后接着执行catch块.此时,catch块会接收
-
JavaScript错误处理机制全面分析讲解
目录 1. Error 实例 2. 原生错误类型 2.1 ReferenceError 2.2 SyntaxError 2.3 TypeError 2.4 RangeError 2.5 URIError 2.6 evalError 3. 自定义错误类型 4. throw 5. try…catch 6. finally 总结 1. Error 实例 JavaScript在运行错误时会抛出一个错误,JS提供了Error构造函数,所有抛出的错误都是这个构造函数的实例 const err = new E
-
全面了解javascript中的错误处理机制
前面的话 错误处理对于web应用程序开发至关重要,不能提前预测到可能发生的错误,不能提前采取恢复策略,可能导致较差的用户体验.由于任何javascript错误都可能导致网页无法使用,因此作为开发人员,必须要知道何时可能出错,为什么会出错,以及会出什么错.本文将详细介绍javascript中的错误处理机制 error对象 error对象是包含错误信息的对象,是javascript的原生对象.当代码解析或运行时发生错误,javascript引擎就会自动产生并抛出一个error对象的实例,然后整个程序
-
JavaScript基础入门之错误捕获机制
目录 前言 Error 对象 throw try-catch-finally finally 的规则 Try / Catch 性能 window.onerror Promise 中的异常 Promise 中抛出异常 Promise中捕捉异常 Vue 的异常捕获 总结 前言 Javascript 引擎是单线程的,因此一旦遇到异常,Javascript 引擎通常会停止执行,阻塞后续代码并抛出一个异常信息,因此对于可预见的异常,我们应该捕捉并正确展示给用户或开发者. Error 对象 当运行时错误产生
-
JavaScript错误处理
一．错误分类 1． 语法错误 也称为解析错误,发生在传统编程语言的编译时,在JavaScript中发生在解释时,这些错误是由代码中的意外字符直接引起的,然后就不能直接编译/解释,eg,在一行代码因缺少右括号,产生了语法错误.发生语法错误时,就不能继续执行代码.在JavaScript中,只有在同一个线程中的代码会受语法错误的影响.在其他线程中的代码和其他外部引用的文件中的代码,如果不依赖于包含错误的代码,则可以继续执行. 2． 运行时错误 也称为异常(exception,在编译期/解释器后).此时
-
javascript事件捕获机制【深入分析IE和DOM中的事件模型】
本文实例分析了javascript事件捕获机制.分享给大家供大家参考,具体如下: 1.什么是事件冒泡? 在排序算法中,我们学过冒泡排序法,所谓冒泡就是让底层的东西浮出水面,对于事件冒泡也同样是如此, 下面我们来看一个例子来说明什么是事件冒泡. <div> <button>测试</button> </div> <script> $("div").bind("click",function(){alert(&q
-
Vue.js@2.6.10更新内置错误处机制Fundebug同步支持相应错误监控
Vue.js 从诞生至今已经 5 年,尤大在今年 2 月份发布了重大更新,即Vue 2.6.更新包括新增 scoped slot 语法.性能提升.动态指令参数等等.其中我们最关注的是错误处理. 异步错误处理 Vue 的内置错误处理机制(组件内 errorCaptured hook 和全局 errorHandler hook)现在也会捕获 v-on 处理程序内部的错误.此外,如果任意一个生命周期 hook 或事件处理程序执行了异步操作,现在可以从函数中返回一个 Promise,Promise 链中
-
JavaScript事件冒泡机制原理实例解析
这篇文章主要介绍了JavaScript事件冒泡机制原理实例解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 DOM事件流(event flow )存在三个阶段:事件捕获阶段.处于目标阶段.事件冒泡阶段,事件冒泡顺序是由内到外进行事件传播,事件冒泡是由IE开发团队提出来的,即事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播. 听了简介介绍之后,您可能不理解,所以举个例子: <html> <head>