减轻JavaScript测试和调试负担

2007-9-26　　　作者：　　　来源：开发者在线 Tony Patton　　　点击：219

像jsp、asp.net、coldfusion这样的web开发平台提供了大量强大服务器端开发选项。但是，它们并没有否定用javascript进行客户端的web开发。 javascript同时提供了逻辑和用户接口功能，减轻了服务器端处理的负载。尽管我们已经使用它有多年了，但是它的开发工具还是有点落后。现在就让我们仔细看看javascript的开发和调试选项。 开发工具 如果你习惯使用诸如visual studio或者netbeans这样的集成开发环境（ide），那么你就一定很熟悉各种调试选项，包括代码单步调试、设置断点，以及监视变量等。在监视代码执行或者追踪错误时，这些都是不可或缺的工具。不幸的是，这些工具在javascript开发人员中并不是十分普及。

调试应用程序开发中的一个重要步骤是追踪脚本或者代码中的错误。这包括隔离代码段，一行一行地分析它们。在使用javascript的时候，你可以使用在开发工具大发展之前用过的方法。在这种情况下，最常用的一种javascript函数是警报信息框。你可以用它来检查保存在变量／对象里的值，并与循环一起使用来查看对象的内容。举个例子，列表a里的html代码没有按照预期的效果执行：<html><head>
<title>js test</title>
<script language="javascript">
function validate() {
var doc = document.forms[0];
var flag = true;
if (doc.fullname.value = '')
flag = false;
if (doc.contactnumber.value = '')
flag = false;
if (flag) doc.submit()
else alert('enter values before submitting.');
}
</script></head>
<body>
<form id="frmtest">
name: <input name="fullname" type="text" /><br />
address: <input name="contactnumber" type="text" /><br />
<input type="button" value="submit" />
</form></body></html> 按理说，它会在表单被真的提交之前验证在两个文本字段里输入的值。这个表单总是不管输入的值是什么就被提交，所以我们可以使用警报语句在脚本执行期间检查值的内容。列表b里的脚本就使用了警报语句来监视变量的值： <html><head>
<title>js test</title>
<script language="javascript">
function validate() {
var doc = document.forms[0];
var flag = true;
alert('script starting‚ flag = ' + flag);
alert('script starting‚ full name = ' + doc.fullname.value);
alert('script starting‚ contact number = ' + doc.contactnumber.value);
if (doc.fullname.value = '') {
alert('first check‚ full name is empty.');
flag = false;
}
if (doc.contactnumber.value = '') {
alert('second check‚ contact number is empty.');
flag = false;
}
if (flag) {
alert('validation successful‚ document will be submitted.');
doc.submit()
} else {
alert('enter values before submitting.');
} }
</script></head>
<body><form id="frmtest">
name: <input name="fullname" type="text" /><br />
address: <input name="contactnumber" type="text" /><br />
<input type="button" value="submit" />
</form></body></html> 果你执行这段脚本，很明显if语句总是为“真”。如果更加仔细地看一看，你会注意到这里使用的是分配操作（=）而不是等于（==）。经过这两个改变，脚本就会按预期的结果执行了。这个错误很常见，尤其是当开发人员在诸如vb.net和其他句法上存在差异的语言之间轮流转换时。我们现在快速浏览更多几个常见的错误：

javascript对大小写敏感，所以变量名、javascript语句，以及类似的内容必须使用正确的格式／大小写。所以要按照统一的方式给你的对象、变量和函数命名。
在代码中使用逗号。除了for语句外，javascript把逗号用作变量的分隔符。
javascript要用大括号来定义一段语句。
字符串必须放在引号（单引号或者双引号）之间。

用alert函数进行调试对于开发人员来说很常见，但是现在有很多其他的选项来监视脚本，包括浏览器和ide。虽然internet explorer是最流行的浏览器，但是它对javascript调试的支持还显得相当初级。如果发生javascript错误，会有一个错误（信息）窗口显示。（大多数javascript错误的）错误消息还远不能让人满意，但是它们至少能够让你知道发生了什么错误。这些消息包括一个行号（尽管它从来都没有与真正的错误行相对应，但是它确实让你离错误行比较近了）。此外，它还能够调用外部应用程序进行调试（比如visual studio，如果安装了的话）或者检查代码。

注意：你可以从“工具｜选项（tools | options）”里启动javascript的调试功能。基于mozilla的浏览器也提供了选择的机会。firefox带有一个javascript控制台，用来显示当前页面上脚本的（错误、警告、信息等）消息。它会明确地显示发生错误的代码，并用箭头指示哪里出现了错误。 netscape和opera也带有javascript控制台。有些浏览器还有用于调试的专用句法。一个典型的例子是opera，它支持将输出送到控制台的opera.posterror()命令。safari浏览器的“调试（debug）”菜单让你可以启动javascript错误的记录，这样它们就会出现在控制台里。

ide选项 你还可以通过自己习惯的ide调试基于浏览器的应用程序。visual studio就是这样一个例子，它能够让你通过它调试internet explorer应用程序。你必须在web服务器（iis）启动调试功能，这要按照下面的步骤进行：

在调试模式（debug｜start）启动web应用程序。
应用程序在一个浏览器窗口里启动。返回到visual studio客户端。选择“调试｜窗口｜运行文档（debug | window | running documents）”。
当前运行的应用程序会出现在“运行文档”窗口里。你可以选择web窗体，在javascript代码里设置断点。
返回web窗体，使用应用程序；执行会在插入的任何javascript断点处停止。

visual studio不是唯一支持调试的ide。例如，dreamweaver有它自己的javascript调试器，让你调试句法和逻辑错误、设置断点、监视变量、进行代码单步调试。它的一个非常好的特性是会用简单几句话解释javascript的错误。你还可以使用单独的javascript调试工具。一个典型的例子是splinetech的javascript html debugger，它是一个功能完备的开发工具。如果你使用eclipse ide，那么jseclipse就是eclipse的一个用于javascript开发的插件。

用于调试的其他语言 javascript已经发展成为进行web客户端编程的标准语言。它有大量的语言资源，但是对开发的支持并不完备。大多数使用javascript的开发人员更倾向于用原来的方法进行调试，但是现在有很多工具来减轻测试和调试的负担。 tony patton的职业生涯始于应用程序开发员，现已获得java、vb、lotus和xml认证证书。