Javascript中获取出错代码所在文件及行数的代码


Posted in Javascript onSeptember 23, 2010

原先使用的是try-catch的方式,在catch语句中,我们会收到一个Error对象(我们也可以抛出一个自定义异常对象)。Firefox中的Error对象拥有如下属性:

message —— 错误提示信息
fileName —— 表示出错代码所在文件
lineNumber —— 出错代码所在行数
stack —— 出错堆栈信息
name —— 异常对象名/类型
但是在IE下,Error对象只有如下属性:

name —— 异常对象名/类型,和Firefox中显示的名称可能不同
message —— 错误提示信息
description —— 和message属性相同
number —— ErrorCode,错误代码,对于普通开发人员来说基本没意义
也就是说在IE下我们无法获得最希望得到的错误代码所在文件名及出错行数的信息。后来在学校论坛求教之后知道了window(全局对象)下有一个onerror的对象。这个对象或者说window的属性绑定的是一个错误处理函数。脚本中任何未被捕获的错误最终都会扩散到window这一层,然后被onerror绑定的处理函数所处理。查了一下相关文档,发现绑定的错误处理函数会接受到三个参数:

view sourceprint?function onError(message,url,line){}

非常欣慰的是,这个机制兼容IE和Firefox。

下面举一个例子:

function doSomething(){ 
var lastErrorHandler = window.onerror; 
window.onerror = function(message,url,line){ 
// 汇报错误 
alert("执行" + url + "文件中的第" + line + "行代码出错,错误信息:" + message); 
window.onerror = lastErrorHandler; 
// 不希望此错误继续扩散 
return true; 
}; 
// 不小心出错了... 
sldfjlskdjflj; window.onerror = lastErrorHandler; 
} 
doSomething();

Javascript中获取出错代码所在文件及行数的代码
这里之所以没用attachEvent的方式,是因为detach比较不方便。如果希望此错误处理变成全局的,那么可以使用attachEvent(Firefox下是addEventListener)的方式。

需要注意,Safari(Chrome使用的也是一样的内核)和Opera都不支持此机制,这两个核心的浏览器都不支持全局的error事件,因此没法使用这种方式来捕获异常信息,只能使用try-catch的方式。

试验了一下,在Safari中的Error对象拥有如下属性:

message —— 错误提示信息
line —— 出错代码所在行数
sourceId —— 一个数字,不明白什么意思
sourceURL —— 表示出错代码所在文件
name —— 异常对象名/类型
Opera下的Error对象拥有如下属性:

message —— 错误提示信息
opera#sourceloc —— 出错代码所在行数
stacktrace —— 出错堆栈信息
这两个浏览器中的Error对象已经提供了足够的信息给我们调试使用了。下面要做的就是把这两种方式结合起来,使之在不同浏览器下都能很好的汇报这些错误。

下面这段代码封装了在不同浏览器之上汇报异常的功能:

<script type=”text/javascript”> 
function reportError(err){ 
var errMsg = []; 
for(var p in err){ 
if(err.hasOwnProperty(p)){ 
errMsg.push(p + "=" + err[p]); 
} 
} 
alert(errMsg.join("\n")); 
} 
function doSomething(){ 
var lastErrorHandler = window.onerror; 
window.onerror = function(message, url, line){ 
// 汇报错误 
reportError({ 
message: message, 
url: url, 
line: line 
}); 
window.onerror = lastErrorHandler; 
// 不希望此错误继续扩散 
return true; 
} // 不小心出错了... 
sldfjlskdjflj; 
window.onerror = lastErrorHandler; 
} 
try{ 
// 执行可能出错的代码 
doSomething(); 
}catch(e){ 
if("\v"=="v"){ 
// 对于IE直接让此错误扩散到最外层 
throw e; 
}else{ 
// 对于其他任意浏览器直接汇报此异常对象 
reportError(e); 
} 
} 
</script>
Javascript 相关文章推荐
jquery应该如何来设置改变按钮input的onclick事件
Dec 10 Javascript
javascript 三种方法实现获得和设置以及移除元素属性
Mar 20 Javascript
JavaScript中为什么null==0为false而null大于=0为true(个人研究)
Sep 16 Javascript
取消选中单选框radio的三种方式示例介绍
Dec 23 Javascript
js模拟淘宝网的多级选择菜单实现方法
Aug 18 Javascript
JavaScript计算器网页版实现代码分享
Jul 15 Javascript
JavaScript 函数模式详解及示例
Sep 07 Javascript
详解JavaScript时间处理之几个月前或几个月后的指定日期
Dec 21 Javascript
Jquery-data的三种用法
Apr 18 jQuery
webpack学习教程之前端性能优化总结
Dec 05 Javascript
layui table 表格模板按钮的实例代码
Sep 21 Javascript
javascript实现计算器功能
Mar 30 Javascript
基于JQuery的一个简单的鼠标跟随提示效果
Sep 23 #Javascript
用js模拟JQuery的show与hide动画函数代码
Sep 20 #Javascript
通过DOM脚本去设置样式信息
Sep 19 #Javascript
javscript对象原型的一些看法
Sep 19 #Javascript
Ext 今日学习总结
Sep 19 #Javascript
JS面向对象编程 for Cookie
Sep 19 #Javascript
网络之美 JavaScript中Get和Set访问器的实现代码
Sep 19 #Javascript
You might like
基于PHP Socket配置以及实例的详细介绍
2013/06/13 PHP
PHP下通过QRCode类库创建中间带网站LOGO的二维码
2014/07/12 PHP
100多行PHP代码实现socks5代理服务器[2]
2016/05/05 PHP
PHP 对象继承原理与简单用法示例
2020/04/21 PHP
js表格分页实现代码
2009/09/18 Javascript
如何确保JavaScript的执行顺序 之jQuery.html并非万能钥匙
2011/03/03 Javascript
jQuery获取动态生成的元素示例
2014/06/15 Javascript
举例详解JavaScript中Promise的使用
2015/06/24 Javascript
JavaScript使用键盘输入控制实现数字验证功能
2016/08/19 Javascript
利用JS制作万年历的方法
2017/08/16 Javascript
vue自定义一个v-model的实现代码
2018/06/21 Javascript
webstorm+vue初始化项目的方法
2018/10/18 Javascript
webstorm中配置Eslint的两种方式及差异比较详解
2018/10/19 Javascript
Webstorm2016使用技巧(SVN插件使用)
2018/10/29 Javascript
从零开始在NPM上发布一个Vue组件的方法步骤
2018/12/20 Javascript
详解js动态获取浏览器或页面等容器的宽高
2019/03/13 Javascript
elementUI Tree 树形控件的官方使用文档
2019/04/25 Javascript
[01:07]DOTA2次级职业联赛 - Fpb战队宣传片
2014/12/01 DOTA
python3简单实现微信爬虫
2015/04/09 Python
详解Python中的文本处理
2015/04/11 Python
python删除列表内容
2015/08/04 Python
Python实现的人工神经网络算法示例【基于反向传播算法】
2017/11/11 Python
python实现文本进度条 程序进度条 加载进度条 单行刷新功能
2019/07/03 Python
Python的Tkinter点击按钮触发事件的例子
2019/07/19 Python
Python集合操作方法详解
2020/02/09 Python
python实现单张图像拼接与批量图片拼接
2020/03/23 Python
终于搞懂了Keras中multiloss的对应关系介绍
2020/06/22 Python
python 中关于pycharm选择运行环境的问题
2020/10/31 Python
Pat McGrath Labs官网:世界上最有影响力的化妆师推出的彩妆品牌
2018/01/07 全球购物
获取邓白氏信用报告:Dun & Bradstreet
2019/01/22 全球购物
会计岗位职责范本
2014/03/07 职场文书
银行竞聘演讲稿范文
2014/04/23 职场文书
女方家长婚礼致辞
2015/07/27 职场文书
2016年法制宣传月活动总结
2016/04/01 职场文书
详解MySQL 联合查询优化机制
2021/05/10 MySQL
HTML5+CSS+JavaScript实现捉虫小游戏设计和实现
2021/10/16 HTML / CSS