`

转载:全面介绍javascript异常处理(try…catch…finally window.onerror)

阅读更多
转载:全面介绍javascript异常处理(try…catch…finally window.onerror)
http://snap.oncoding.cn/javascript/base/article200907/216.html

try catch finally 语句说明

try catch finally是javascript语言提供的异常处理机制。语法结构如下
try {
  //这段代码从上往下运行,其中任何一个语句抛出异常该代码块就结束运行
}
catch (e) {
  // 如果try代码块中抛出了异常,catch代码块中的代码就会被执行。
  //e是一个局部变量,用来指向Error对象或者其他抛出的对象
}
finally {
  //无论try中代码是否有异常抛出(甚至是try代码块中有return语句),finally代码块中始终会被执行。
}


try…catch…finally…语法中除了try以外catch和finally都是可选的(两者必须要有一个),也就是说try…catch…finally…语法有以下三种形式

1 
try{

//some code

}catch(e){

//somecode

}finally{

//some code

}

2
	
try{

//some code

}catch(e){

//somecode

}

3	
try{

//some code

}finally{

//some code

}


如果有一定catch,一旦try中代码抛出异常以后就是先执行catch中的代码,然后执行finally中的代码。如果没有catch语句,try中的代码抛出异常后,就会先执行finally中的语句,然后将try中抛出的异常以异常的方式继续往上抛。

不管try代码块的执行时如何被终止的(出现异常、return、自然终止)finally中的语句始终会被执行,正是由于finally的这种特性,通常finally用来执行一些清理工作。如果try中代码是以return,continue,break的方式终止的,Javascript引擎会在执行完finally中的语句以后再执行相应的try中的返回语句。
throw语句说明
    throw语句在javascript1.4中已经实现。try的语法很简单,如下
throw expression;

其中的expression可以是任何一种类型,也就是说throw “There is a error” 或是throw 1001都是正确的。但通常我们会抛出一个Error对象或是Error对象的子类。关于Error我们稍后介绍,先看一段throw的样例代码。

function factorial(x) {
    // If the input argument is invalid, throw an exception!
    if (x < 0) throw new Error("x must not be negative");
    // Otherwise, compute a value and return normally
    for(var f = 1; x > 1; f *= x, x--) /* empty */ ;
    return f;
} 


Error对象

Error对象和它的子类是在javascript1.5中实现的。Error的构造函数有两种
new Error( )
new Error(message )

Error有两个基本的属性name和message。message用来表示异常的详细信息。而name指的的是Error对象的构造函数。此外,不同的js引擎对Error还各自提供了一些扩展,例如mozilla提供了fileName(异常出现的文件名称)和linenumber(异常出现的行号)的扩展,而IE提供了number(错误号)的支持。不过name和message是两个基本的属性,在firefox和ie中都能够支持。Javascript中Error还有几个子类EvalError, RangeError, ReferenceError, SyntaxError, TypeError, URIError,各自的意思就不在这里详细描述了,读者可以在我提供的参考文档中找到相应的参考。
Javascript的异常处理机制和window.onerror句柄

当javascript代码中出现错误的时候,js引擎就会根据js的调用栈逐级寻找对应的catch,如果没有找到相应的catch handler或catch handler本身又有error或者又抛出新的error,最后就会把这个error的处理交给浏览器,浏览器会用各自不同的方式(IE以黄色三角图案显示在左下角,而firefix会显示在错误控制台中)显示错误信息给访问者。很多场景下,我们会觉得这种错误提示方式不够友好,而且提示信息很隐蔽,那么我们机会自定义这种错误提示的方式吗?答案是有,就是window.onerror属性。

javascript的window对象有一个特别的属性onerror,如果你将某个function赋值给window的onerror属性,那么但凡这个window中有javascript错误出现,该function都会被调用,也就是说这个function会成为这个window的错误处理句柄。

// Display error messages in a dialog box, but never more than 3
window.onerror = function(msg, url, line) {
    if (onerror.num++ < onerror.max) {
        alert("ERROR: " + msg + "\n" + url + ":" + line);
        return true;
    }
}
onerror.max = 3;
onerror.num = 0; 


onerror句柄会3个参数分别是错误信息提示,产生错误的javascript的document ulr,错误出现的行号。

onerroe句柄的返回值也很重要,如果句柄返回true,表示浏览器无需在对该错误做额外的处理,也就是说浏览器不需要再显示错误信息。而如果返回的是false,浏览器还是会提示错误信息。

window.onerror=function(){

alert(”xx”);

return true; //如果注释掉该语句,浏览器中还是会有错误提示,反之则没有。

}

function throwerror(){

throw new Error(”cc”);

}


我们在开发HTML的过程中避免不了一些Js的异常,通常我们也不可能依赖客户打开浏览器的错误提示框(如上图)来为我们定位bug提供线索,而利用window.onerror句柄我们就可以讲错误提示信息显示出来,客户只要在错误出现的时候,提供相应的截屏就可以了,这点可以很好的帮助开发人员定位,分析javascript相关的错误。

CSDN 资料
http://topic.csdn.net/u/20100818/16/27b3d085-d9ce-43cd-94cd-cf09339f6859.html?007070039746822399

可见,IE 和 Firefox 提供了对 window.onerror 事件的支持,当页面内的 JavaScript 脚本出现错误时,window.onerror 被触发。

标准中的说法
HTML4.01
W3C HTML4.01 规范第 18.2.3 节介绍了 HTML 中的固有事件(Intrinsic events),其中并没有 onerror 事件。

HTML5  
在 HTML5 规范草案中描述了 window 对象的事件处理程序,其中有 onerror 事件存在,详细情况请参照草案说明:6.1.6.2 Event handlers on elements。可见,各浏览器还没有统一此实现。

MSDN和MDC  
根据 MSDN 及 Mozilla Developer Center 中的描述,当页面中的脚本出错的时候就会触发 window.onerror 事件,这个事件的监听器(event handler)拥有三个参数:msg(错误消息内容)、url(发生错误的页面的 URL)、line(发生错误的代码所在行行号)。  
而浏览器是否按照其默认方式显示错误消息,取决于 onerror 事件的返回值。若返回 false,则在浏览器控制台(若有)中显示错误消息。反之则不再显示错误消息。
可见,对window.error的支持差异来自标准自身的不一致性,HTML5可解决这个问题。
所以,还是放弃使用window.onerror吧,使用try-catch捕捉错误是比较标准的做法。
分享到:
评论

相关推荐

    JS异常处理try..catch语句的作用和实例

    除了try..catch语句,window.onerror是一个全局错误处理函数。当脚本中未被捕获的错误发生时,window.onerror会被调用。通过返回true,可以阻止浏览器默认的错误处理行为,比如在控制台中打印错误信息,从而可以...

    javascript 异常处理使用总结

    在JavaScript中,异常处理主要通过try...catch...finally语句实现,此外,JavaScript也提供了window.onerror事件和throw语句来处理异常。 首先,我们来看一下try...catch...finally语句的用法。try语句中包含可能抛...

    JavaScript错误处理

    2. **try...catch语句**:这是一种更精确的错误处理方式,允许我们在可能出错的代码块周围包裹`try`块,然后在`catch`块中捕获并处理异常。例如: ```javascript try { // 可能会抛出错误的代码 } catch (error) {...

    javascript经典特效---JavaScript容错脚本.rar

    针对这些错误,JavaScript提供了try...catch语句来捕获和处理异常。在try块中,你可以放置可能抛出错误的代码,如果其中的代码抛出错误,那么执行会立即停止并跳转到相应的catch块。catch块可以包含处理错误的代码,...

    全局异常处理的实现

    在Java中,我们可以利用`try-catch-finally`块来实现全局异常处理。通过在主程序或服务层创建一个全局的`catch`块,可以捕获所有未被捕获的异常,并进行相应的日志记录、错误报告或者用户友好的错误提示。此外,...

    JavaScript完全自学宝典 源代码

    示例描述:介绍JavaScript与Microsoft Office互操作的方法。 14.1.html 使用JavaScript向Word中写入内容。 14.2.html 使用JavaScript从Word中读取内容。 14.3.html 使用JavaScript向Excel文件中写入内容...

    JS中的异常处理方法分享

    `window.onerror` 是全局的错误处理函数,当JavaScript代码在页面中抛出未被捕获的错误时,它会被调用。通过设置这个回调,我们可以自定义错误处理逻辑,比如记录错误信息或提供友好的用户反馈。例如: ```...

    javascript 容错处理代码(屏蔽js错误)

    在JavaScript中,错误处理通常通过两种主要方式实现:`window.onerror` 事件和 `try...catch` 语句。 1. **`window.onerror` 事件**: 当全局JavaScript错误发生时,`window.onerror` 事件会被触发。通过为这个...

    Js的常用调试方法整理集合 全面详细

    本文将全面详细介绍JavaScript的常用调试方法,帮助开发者高效地定位和解决问题。 1. **使用`alert()`或`document.write()`** `alert()`函数可以在浏览器弹出一个对话框显示变量的值,这对于快速检查单一变量的值...

    java如何快速查找js代码错误

    var func = window.onerror.caller; var index = 0; while (func != null) { str += "调用栈[" + index + "]: " + func.toString() + "\n"; str += "===================\n"; func = func.caller; index++; ...

    第28章 错误处理与调试1

    2. **错误处理**:ECMAScript 3引入了`try...catch`和`throw`语句来处理异常。`try`块用于包裹可能出错的代码,如果在`try`块内发生错误,会跳转到`catch`块进行处理。`catch`捕获到的错误对象(e)包含了关于错误的...

    javascript Error 对象 错误处理

    除了传统的`try...catch`机制外,`window.onerror`也可以用来捕获全局范围内未被捕获的错误。此事件处理器接受三个参数:错误消息、出错脚本的URL以及出错行号。 ```javascript window.onerror = function(msg, url...

    Professional JavaScript For Web Developers

    - **try...catch...finally**:用于捕获并处理运行时错误,保证程序的健壮性。 - **Error对象**:提供了详细的错误信息,便于调试。 - **全局错误监听**:通过window.onerror可以监听全局的运行时错误。 6. **...

    Javascript在IE和FireFox中的不同表现

    - IE使用`try...catch...finally`语句捕获错误,而Firefox支持`window.onerror`全局错误处理。 为了解决这些问题,开发者通常需要使用条件注释、库如jQuery或polyfills来确保代码在各个浏览器中的兼容性。同时,...

    Exceptions:探索异常

    7. **错误处理最佳实践**:避免使用全局的`window.onerror`处理所有异常,因为这样可能导致错误信息被忽略或处理不当。最好在每个可能出现错误的地方使用局部的`try...catch`。 总的来说,异常处理是JavaScript开发...

    精通JavaScript

    8. **错误处理**:通过try...catch...finally语句捕获和处理运行时错误,以及全局的window.onerror事件处理器。 9. **DOM操作**:JavaScript可以直接操作DOM(文档对象模型),改变网页元素的样式、内容和结构,...

    js代码-promise异常捕获

    为了解决这个问题,可以使用`.catch`来捕获未处理的异常,就像在全局范围内使用`try...catch`一样: ```javascript promise .then(result =&gt; { // 可能会抛出错误的代码 }) .catch(error =&gt; { // 这里可以捕获...

Global site tag (gtag.js) - Google Analytics