最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
JavaScript错误与调试方法详解
时间:2013-11-01 编辑:简简单单 来源:一聚教程网
前端开发中,应该除非大型团队对编程有着严格的日志控制和错误机制,在小型团队中的前端使用错误与调试还是基本上靠Firebug等调试工具。前端迭代时间短周期也比较短,在这方面也的确是一个欠缺。
阅读了《编写可维护的JavaScript》书中的第十章 ”抛出自定义错误“ 对代码的书写和规范还是有一定的启发。把一些有用的东西作为笔记记下来。
错误类型:
•Error – 基本错误类型
•EvalError – 通过 eval() 函数执行代码发生的错误抛出
•RangeError – 数字超出其边界时抛出(例:创建一个负数索引的数组)
•ReferenceError – 期望的对象不存在
•SyntaxError – 给 eval() 函数传递的代码中有语法错误
•TypeError – 变量不是期望的类型(new 10,’prop’ in true)
•URLError – 常见于 encodeURI()、encodeURIComponent(),decodeURI() 等传递了非法格式的URI字符串时抛出。
关于 Try-Catch 的应用
•修复了一个难以调试和修复的BUG之后,尝试增加自定义错误,以便于下次调试时快速的定位错误代码。
•编写代码时的一些防御型、预见性的错误可以尝试添加错误处理函数。
•正在编写的代码需要提供给其他人使用,如果按照对方的思维,在特定的情况中抛出错误处理
错误以及错误处理不是为了防止错误,而是为了在错误发生时能够更加快速的调试和定位错误。
例
A 使用alert() 和document.write() 方法监视变量值
如果要中断代码的运行,监视变量的值,则使用alert() 方法;
如果需要查看的值很多,则使用document.write() 方法,避免反复单击“确定”按钮;
B 使用window.onerror 事件
当页面出现异常时,onerror 事件会在window 对象上触发。它能在一定程度上告诉开发者相关的错误信息。
示例:
代码如下 | 复制代码 |
|
注意:在IE 中,触发error 事件后,正常的代码会继续运行,所有的变量和数据都会保存下来,在其onerror 事件处理方法中可以正常访问到;而在Firefox 中,触发error 事件后,一切都结束,所有的变量和数据都将被销毁。
C 使用 try...catch 语句找错误
示例:
代码如下 | 复制代码 |
|
注意:try...catch 并不能很好的处理JavaScript 的语法错误。
示例:
代码如下 | 复制代码 |
|
该示例并没有进入catch 块中。
D 使用相关调试器
在IE 和Firefox 浏览器中,可以使用相关的调试器或插件对JavaScript 进行调试。
● 在Firefox 浏览器中,可以使用其自带的“错误控制台”。操作步骤如下:
打开Firefox 浏览器 → 在菜单条“工具”中 → 选择“错误控制台”即可。
在没有其他插件的情况下,其自带的“错误控制台”是一个非常不错的选择。
另外,在Firefox 浏览器中,还有一些很不错的调试器,如:Venkman、Firebug 等。
Venkman 调试器安装后,可以在Firefox 浏览器 → 在菜单条“工具”中 → 选择“JavaScript Debugger ”命令启用;
Firebug 调试器安装后,可以在Firefox 浏览器 → 在菜单条“工具”中 → 选择“Firebug”→ 选择“打开 Firebug”即可;
● 在IE 浏览器中,可以使用 Microsoft Script Debugger 调试器
Microsoft Script Debugger 是微软随IE 4 一同发布的一个IE插件,可以从微软的官方网站上免费下载。
下载安装以后,必须将IE 浏览器的调试选项打开才能使用。操作步骤如下:
1> 打开IE 浏览器 → 选择菜单栏的“工具”→ “Internet 选项”命令 → “高级”选项卡 → 将“禁用脚本调试(Internet Explorer )”复选框中的勾去掉即可。
2> 当IE 浏览器正在浏览页面时,运行Microsoft Script Debugger 调试器工具即可进行调试。
-
上一个: extjs自定义组件函数回调实例介绍
相关文章
- 收集的14款最优秀的JavaScript调试工具 04-14
- Eclipse断点调试【图解教程】 01-31
- javascript中5个常用web debug调试插件介绍 11-21
- HTML简单购物数量小程序代码展示 10-31
- html canvas实现弹幕功能 10-31
- HTML中空格表示的意义 10-31