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 相关文章推荐
Add Formatted Data to a Spreadsheet
Jun 12 Javascript
第一个JavaScript入门基础 document.write输出
Feb 22 Javascript
jquery+json实现的搜索加分页效果
Mar 31 Javascript
JQuery为页面Dom元素绑定事件及解除绑定方法
Apr 23 Javascript
jquery显示loading图片直到网页加载完成的方法
Jun 25 Javascript
常用原生JS兼容性写法汇总
Apr 27 Javascript
浅谈jQuery 中的事件冒泡和阻止默认行为
May 28 Javascript
vue 设置proxyTable参数进行代理跨域
Apr 09 Javascript
基于vue-cli 路由 实现类似tab切换效果(vue 2.0)
May 08 Javascript
AI小程序之语音听写来了,十分钟掌握百度大脑语音听写全攻略
Mar 13 Javascript
为什么推荐使用JSX开发Vue3
Dec 28 Vue.js
React中的Context应用场景分析
Jun 11 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 zend 相对路径问题
2009/01/12 PHP
DISCUZ 论坛管理员密码忘记的解决方法
2009/05/14 PHP
解析获取优酷视频真实下载地址的PHP源代码
2013/06/26 PHP
解密ThinkPHP3.1.2版本之独立分组功能应用
2014/06/19 PHP
yii2.0整合阿里云oss上传单个文件的示例
2017/09/19 PHP
基础的prototype.js常用函数及其用法
2007/03/10 Javascript
JS批量修改PS中图层名称的方法
2014/01/26 Javascript
JavaScript中split() 使用方法汇总
2015/04/17 Javascript
详解Node.js如何开发命令行工具
2016/08/14 Javascript
基于slideout.js实现移动端侧边栏滑动特效
2016/11/28 Javascript
解决微信内置浏览器返回上一页强制刷新问题方法
2017/02/05 Javascript
微信小程序获取手机网络状态的方法【附源码下载】
2017/12/08 Javascript
OkHttp踩坑随笔为何 response.body().string() 只能调用一次
2018/01/08 Javascript
vue+express 构建后台管理系统的示例代码
2018/07/19 Javascript
json数据传到前台并解析展示成列表的方法
2018/08/06 Javascript
JS实现继承的几种常用方式示例
2019/06/22 Javascript
vue 遮罩层阻止默认滚动事件操作
2020/07/28 Javascript
python进阶教程之词典、字典、dict
2014/08/29 Python
在windows系统中实现python3安装lxml
2016/03/23 Python
Python读取stdin方法实例
2019/05/24 Python
Python PIL读取的图像发生自动旋转的实现方法
2019/07/05 Python
使用coverage统计python web项目代码覆盖率的方法详解
2019/08/05 Python
Python中的延迟绑定原理详解
2019/10/11 Python
python图的深度优先和广度优先算法实例分析
2019/10/26 Python
tensorflow之自定义神经网络层实例
2020/02/07 Python
Python pip安装模块提示错误解决方案
2020/05/22 Python
100%植物性、有机、即食餐:Sakara Life
2018/10/25 全球购物
杠杆的科学教学反思
2014/01/10 职场文书
二年级语文教学反思
2014/02/02 职场文书
学术诚信承诺书
2014/05/26 职场文书
幼儿园大班开学寄语
2014/08/02 职场文书
企业员工爱岗敬业演讲稿
2014/08/26 职场文书
大学生实习证明范本
2014/09/19 职场文书
四风问题对照检查整改措施思想报告
2014/10/05 职场文书
大学生安全教育主题班会
2015/08/12 职场文书
大学生自我鉴定怎么写
2019/05/07 职场文书