JavaScript调试方法以及常见错误
本文作者(李丹),请您在阅读本文时尊重作者版权。
摘要：随着互联网的不断发展和Web应用的日趋丰富，JavaScript越来越多地被运用在我们的网页中，已成为当今最流行的互联网编程语言之一。但至今JavaScript还没有一个被广泛认可的开发环境，这就给代码的编写和调试以及后期的修改和维护带来了极大的不便，为此，文章讨论了调试JavaScript的几种方法，详细介绍了用传统的内置函数进行代码的跟踪，以及如何使用浏览器插件Firebug对JavaScript进行调试。文章还列出了开发过程中出现频率较高的脚本错误，并对错误出现的原因和现象进行了说明。最后总结了JavaScript开发的相关经验。
关键词：互联网 web javascript 调试 firebug
1 概述
在过去，JavaScript只是被用来做一些简单的网页效果，并没有受到重视。自从Ajax开始流行后，人们发现利用JavaScript可以给用户带来更好的体验，这门语言被越来越多地运用到网站中。JavaScript功能强大，可以方便操纵各种浏览器对象，控制浏览器的外观、状态和运行方式，具有极强的web前端表现力，构建交互性更强的动态网页，从而使页面更加美观、友好；JavaScript还可以使多种任务仅在客户端就可以完成，而不需要网络和服务器的参与，从而支持分布式的运算和处理。作为web开发人员，使用JavaScript以实现各种复杂功能的同时，调试成为开发过程中的一大难题。JavaScript没有类似Java IDE(Eclipse) 的集成开发环境，当出现错误或未产生预想的执行结果时不容易发现和跟踪，所以正确有效地调试JavaScript成为网页开发中错误排查和修正的重要手段。同时，由于JavaScript的语言特点及缺少有效的语法检查工具，在开发过程中容易出现一些难以发现的语法错误，了解这些错误，并在开发中尽量避免也是提高开发效率的关键。
2 JavaScript简介及调试方法
2.1 JavaScript的基本概念及特点
JavaScript是一种基于对象的脚本语言，用于开发Internet客户端的应用程序，可在所有主要的浏览器中运行，包括Internet Explorer，Mozilla，Firefox，Netscape，Opera等[1]。其主要有以下几个特点：
①解释性语言：JavaScript是一种解释性脚本语言，无需专门编译器编译，而是在程序运行过程中被逐行地解释，大量节省客户端与服务器端进行数据交互的时间。
②基于对象：JavaScript是基于对象的脚本编程语言，能通过DOM（文档结构模型）及自身提供的对象及操作方法来实现所需功能。
③事件驱动：JavaScript采用事件驱动方式，能响应键盘事件，鼠标事件以及浏览器窗口事件等，并执行指定的操作。
④跨平台：JavaScript是平台无关的语言，脚本的正确运行依赖于浏览器，而与具体的操作系统无关。只要客户端装有支持脚本的浏览器，程序运行的结果就能正确反映在客户端浏览器上。
⑤相对安全性：JavaScript不允许访问本地硬盘，并且不能将数据存入到服务器上，不允许对网络文档进行修改和删除，只能通过浏览器实现信息浏览或动态交互，从而有效地防止数据丢失。
2.2 JavaScript调试的几种方法
可以使用JavaScript的内嵌函数对代码进行跟踪，这是最原始也是最简单的方法；还可以使用专门的工具进行更有效更便捷的调试。当前流行的调试工具主要包括Firefox下的Firebug，JavaScript Debugger Venkman和IE下的Developer Toolbar，IE Debugger，IETester等[2]。下面主要介绍如何应用传统的调试方法和现在被广泛使用的Firebug插件进行高效的、切实可行的JavaScript开发。
2.3 使用alert方法进行调试
最简单和原始的JavaScript调试是使用alert函数，此函数接收一个变量作为参数，执行时页面会弹出消息对话框显示变量的值，用于查看某个变量值是否正确，或者定位错误代码。相信web开发人员都使用过这一方法，但如何恰当地使用此函数，并快速定位到有问题的代码呢？举个例子：开发某旅游网站的搜索功能，用户输入想要查询的地名或景点名称，系统搜索后会显示结果列表，该列表会把用户输入的查询关键字以红色字体突出显示。若搜索后页面无法正确显示查询结果则说明JavaScript代码执行出现错误，可能存在两种情况，一是在执行语句过程中出现语法错误，二是执行中出现逻辑错误。下面分别就这两种情况进行说明。出现语法错误时浏览器一般会有错误报告，指出错误原因和出现位置，但很多情况错误信息并不准确，对开发者没有太大的帮助，这时定位错误代码的位置就十分重要了。首先检查代码，在认为可能会出现语法问题的语句前后分别调用alert，若提示框均未显示则说明错误发生的第一个alert语句之前，需往前继续排查；如果第一个alert提示框可以弹出而第二个没有，或者两个提示框都可弹出但与预期结果不同，就说明两个alert之间的语句有问题；如果都没问题则继续向后进行排查，注意不要一次调用过多的alert，这样调试者可能会产生混淆。出现逻辑错误会一般采取从后往前的倒序排查，先在代码最后打印需要显示的元素或变量，检查是否正确，若数据有误，则继续向前排查过滤数据的逻辑，在重要条件的执行前后调用alert，看是否出现判断条件不完整、中间数据处理错误等问题，如此反复找出问题所在。若数据处理用到for循环，用alert调试起来就显得麻烦且效率不高，一个好用的调试工具此时就显得更加重要，下面就介绍火狐浏览器的调试工具Firebug。