JavaScript错误与异常处理.ppt

融智技术学院 第13章 JavaScript错误与异常处理 错误报告、错误处理以及代码调试，一直被业界认为 是JavaScript脚本语言的弱项。但随着ECMAScript 3 和 ECMAScript 4规范的推出以及一些新的调试器的出现， 该局面有所改观。 如果不在代码中进行适当的错误处理以及掌握良好的 调试方法和技巧，面对一堆纷繁复杂的JavaScript脚本代 码时，错误查找和代码调试将成为令人非常头痛的问题。 本章将介绍JavaScript在不同浏览器中的错误报告形式、 错误和异常的处理方法以及一些常用的调试方法，力求让 读者在JavaScript脚本编程中遇到代码错误和异常时可以 坦然处之，而不至于束手无策。 融智技术学院 13.1 为何进行错误处理 在JavaScript脚本语言的发展过程中，由于早期的浏览 器不支持错误处理语句，而只能在函数中返回-1、true或 false等特殊的值，并根据这些返回值来判断代码是否出现 错误 JavaScript脚本语言在版本更替过程中，提供了越来 越多的错误处理方法，使开发者能快速确定发生了什么错 误，以及定位错误发生的位置，从而大大提高了程序的正 确性、可靠性，同时也很大程度上缩短了开发周期，具有 十分重大的意义。 融智技术学院 13.2 错误与异常的关系 JavaScript中的错误可以分为语法错误和运行错误。 语法错误一般简称为错误（Error），而运行错误一般也 叫做异常(Exception)。错误和异常同属于错误，但是也 有着本质的区别。下面将分别予以介绍，并分析它们之间 的异同点。 融智技术学院 13.2.1 错误 错误，指语法性错误，即是偏离了可接受的代码行为的 一个动作或者实例。 在JavaScript脚本中，一旦有语法错误出现，整个程 序不能正常启动运行。类似于C、C+、Java等高级语言， 其语法检查在程序编译或解释时进行，一旦有语法错误存在 ，整个页面则无法正常装载，从而不能正常启动运行。 融智技术学院 13.2.2 异常 异常，指运行时的错误，即程序已经通过编译或者 解释，在程序执行过程中出现的一个事件中断了正常指 令的运行。异常通常由一些非法的动作所引起。 在JavaScript脚本中，异常的影响范围为该代码所 在的线程，而其他不依赖于出现异常处的代码的线程则 可以正常运行。 融智技术学院 13.2.3 异同点 错误和异常都是程序的错误，皆为开发者所不能容忍。 错误是语法性的错误，发生在程序编译或者解释时，其直接 的后果将是程序无法正常启动；异常是非法动作所引起的错 误，发生在程序运行时，其直接的后果是使程序不能正常地 运行。 融智技术学院 13.3 不同浏览器环境中的错误报告 不同浏览器内部使用不用的JavaScript解释器，因 此错误报告的形式也是不尽相同的。有的是直接弹出错 误消息，如Microsoft IE；有的只是简单地把错误消息记 录在控制台中，如Mozilla。本节简要的介绍目前流行的 几种浏览器对JavaScript的错误报告形式。 融智技术学院 13.3.1 Windows IE Windows IE中对JavaScript的错误报告形式是多样的。 默认情况下，某些IE版本会弹出一个错误的警告框，并列出错 误类型和错误所在的行数，如图13.4所示；某些IE版本只是在 页面状态栏中显示：“页面出现错误”。 融智技术学院 13.3.2 Mozilla Mozilla是一个自由的、源码开放的浏览器（或核心）， 体积小速度快，为目前最流行的浏览器之一，Firefox浏览器 为其中一种。Mozilla的实现完全不同于Microsoft IE，采用标 签式浏览，并可以便捷地添加或扩展插件。 融智技术学院 13.3.3 MacOS Safari 在众多浏览器中，MacOS Safari对JavaScript脚本 错误调试的支持是最不尽如人意的。在默认的情况下， Safari不会产生任何错误报告。为了浏览器能报告 JavaScript脚本错误，可以通过下列步骤完成： 打开一个命令终端； 运行命令：defaults write com.apple.Safari IncludeDabugMenu 1; 重新启动Safari浏览器； 此时浏览器工具栏成功添加“Debug”按钮，单击该按钮， 并选上“Log JavaScript Exceptions”选项； 在Application/Utilities下打开Console.app，则Safari在 该控制台上报告JavaScript错误。 融智技术学院 13.3.4 MacOS IE MacOS IE在默认情况下，对JavaScript错误也不产生 任何报告。为了浏览器能报告JavaScript脚本错误，可以通 过下列步骤完成： 选择菜单栏“编辑查看”，打开“查看”对话面板； 选择“Web浏览器”选项卡，单击“Web设置”按钮，把其中“允 许运行Script脚本（Enable Scripting）”和“显示错误报告 （Show Scripting Error Alerts）”两个选项选中。 通过以上步骤，如果页面中遇到JavaScript脚本错误， MocOS IE浏览器弹出警告框提示用户错误的类型。 融智技术学院 13.3.5 Opera 7 和Mozilla相似，Opera 7同样以JavaScript控制台的 方式来记录页面中的JavaScirpt脚本错误信息。可以选择菜 单栏“窗口特殊插件JavaScript控制台”来打开此控 制台。当页面中有JavaScript错误发生时，则在此控制台中 记录下来，其错误信息包括：错误类型、错误信息、错误发 生的线程以及发生错误的文件和行数等。 融智技术学院 13.3.6 小结 上面几个小节分别简要介绍了不同浏览器环境中的错误 报告形式，从中可明显地看出，各个浏览器平台均需进行彼 此不同的设置，在浏览器载入包含错误或异常代码的文档时 才能自动识别错误或异常代码的所在。 既然错误对脚本程序具有很大的危害，在JavaScript 脚本中进行相应的错误处理显得非常有必要。一般而言， JavaScript脚本提供了两种经典的错误处理方法：使用 onerror函数和try/catch结构，下面分别介绍这两种错误处 理方法的具体用法及使用场合。 融智技术学院 13.4 使用onerror事件进行错误处理 onerror事件为浏览器对象模型（BOM：Browser Object Model）中定义的标准事件，用于捕捉代码的错误， 并引导开发人员进行相应的处理，较之使用try/catch语句进 行错误处理的方式，该方法简单明了，首先介绍BOM中定义 的onerror事件。 融智技术学院 13.4.1 onerror事件 onerror事件是BOM的标准事件之一，只要页面中发生 错误，该事件立即被激活，开发者仅需添加事件处理函数即 可。onerror事件被激活后，系统调用其对应的事件处理函 数进行响应。在JavaScript脚本中，onerror事件处理函数 可为如下两种结构： 函数声明与函数体合并 函数声明和函数体分离： 融智技术学院 13.4.2 onerror错误处理方法 onerror事件被激活的同时，传递3个参数给事件响应函数 ： Error Message：错误报告消息，如缺少右括号、对象 没有属性方法等； URL：发生错误的文件的URL地址； Line Number：错误所在的具体行数。 程序运行后，单击页面中“异常”按钮 融智技术学院 13.4.3 onerror错误处理方法的优缺点 onerror错误处理方法简洁易行，仅需添加onerror事件 响应函数即可，获得的信息也较为丰富，包括错误信息、产生 错误的文件以及错误所在行数等。 不幸的是，onerror事件是浏览器对象模型（BOM）中 定义的句柄，并不被特定的浏览器（如Safari等）所支持。也 即是说，并不是所有的浏览器都支持onerror事件。即使在支 持onerror事件的浏览器中，不同浏览器的处理方式也不尽相 同。基于此，很多开发者往往偏爱于用第二种处理方式即使用 try/catch结构来处理脚本中出现的错误。 融智技术学院 13.5 使用try/catch结构进行错误处理 try/catch结构原本为Java等高级语言中才支持的经典错 误处理方法，用于监视程序代码中隐藏的错误和异常。由于该 结构处理程序代码隐藏的错误和异常非常有效，ECMAScript 规范引入了在JavaScript脚本中获得支持的try/catch结构，来 解决JavaScript脚本较为薄弱的错误报告、错误处理以及代码 调试环节，首先来了解JavaScript脚本中的try/catch结构。 融智技术学院 13.5.1 try/catch结构 熟悉Java程序设计语言的读者，对try/catch结构 应该不会陌生，因为try/catch结构是Java语言中用来处 理异常的经典结构。 融智技术学院 13.5.2 Error对象 在上面的实例中，得到异常报告：“catch捕捉到异常！”。 开发者同样会遇到使用onerror方法面临的突出问题：关于错误 的信息量太少。事实上，catch部分引入的参数exceptionError 对象。 Error对象有两个属性： Name：Error对象的类型，Error对象是一个基类，其下面还有 若干子类。 Message：Error对象中包含的错误信息。 融智技术学院 13.5.3 嵌套try/catch结构 虽然JavaScript不支持一个try关键字带多个catch的结 构，但其支持嵌套的try/catch结构。嵌套try/catch结构可十 分容易地解决部分读者关于“catch里面又发生异常怎么办” 的问题。 融智技术学院 13.5.4 throw抛出异常 try/catch结构不仅可捕捉到系统抛出的异常，也可以捕 捉到开发者抛出的异常。在ECMAScript 3规范后续的版本中 ，开发者都可使用throw抛出自定义的异常。在JavaScript脚 本中可以使用throw抛出任意异常，包括数字、字符串、布尔 值或者对象。 融智技术学院 13.6 脚本代码调试 类似于C、C+、Java等高级编程语言，调试也是 JavaScript脚本程序开发过程中不可或缺的步骤，是程序能正常 发挥作用的重要保证。当程序结果不正确或需查看其中变量的动 态变化情况时，开发者就要对代码进行跟踪调试，以定位错误并 修正代码。在JavaScript脚本中，对于短小简单的脚本程序，开 发者可以用alert或者Java控制台来帮助调试。但对于比较庞大的 脚本程序，以上两种方法已经不能满足调试的需求，而只能借助 于调试器，本节将介绍两个常用的调试器：Microsoft Script Debugger和Venkman。 融智技术学院 13.6.1 使用alert语句跟踪调试 alert调试方法就是在脚本中特定位置插入alert语句， 对代码的运行情况进行有目的地跟踪，以定位错误和异常。 虽然该方法相对比较笨，但是alert调试是最简单而实用的方 法。相信很多编过C程序的读者，在调试C语言程序的时候喜 欢用printf()函数打印一些信息，只要printf()函数能成功打 印就表明程序能正常运行到此位置（相当一个断点），从而 判断错误发生在该语句之后。 融智技术学院 13.6.2 使用Java控制台 在支持LiveConnect技术的浏览器中（Microsoft IE不 支持）可用Java控制台来协助脚本调试，该方法和alert调 试方法类似，区别在于它使用 “java.lang.System.out.println()”来代替alert语句。 融智技术学院 13.6.3 使用Microsoft Script Debugger调试器 启动Microsoft Script Debugger调试器还可以使用如下方法： 若在页面运行过程中出现错误，在弹出的“错误”警告框询问 “是否要进行调试”信息时，单击是按钮，启动Microsoft Script Debugger调试器； 在JavaScript脚本代码中嵌入debugger命令，当运行至 debugger命令处时，浏览器启动Microsoft Script Debugger调 试器 融智技术学院 13.6.4 使用Venkman调试器 Venkman是Mozilla开发的JavaScript调试器，其名字 来源于电影捉鬼者里面主角的名字。作为优秀的 JavaScript调试器之一，其强大的调试功能不愧于“捉鬼者” 的称号。其版本不断更新，最新的版本为Venkman0.9.86。 融智技术学院 13.7 本章小结 本章主要介绍了JavaScript中的错误与异常处理。在阐述 进行错误处理的重要性的同时，比