JSLint定义了一组编码约定,这比ECMA定义的语言更为严格。这些编码约定汲取了多年来的丰富编码经验,并以一条年代久远的编程原则 作为宗旨:能做并不意味着应该做。JSLint会对它认为有的编码实践加标志,另外还会指出哪些是明显的错误,从而促使你养成好的 JavaScript编码习惯。
基本介绍
JSLint是一个JavaScript验证工具(非开源),可以扫描JavaScript源代码来查找问题。如果JSLint发现一 个问题,JSLint就会显示描述这个问题的消息,并指出错误在源代码中的大致位置。有些编码风格约定可能导致未预见的行为或错误,JSLint除了能指 出这些不合理的约定,还能标志出结构方面的问题。尽管JSLint不能保证逻辑一定正确,但确实有助于发现错误,这些错误很可能导致浏览器的 JavaScript引擎抛出错误。
JSLint可能会把一些结构方面的错误标志为可疑的编码实践,以下列出了其中一部分(完整的列表可以参考JSLint的文档)。
JSLint要求所有代码行都以分号结束。尽管JavaScript确实允许将换行符作为行结束符,但一般认为这种做法是不明确的,而且是不好的编码风格。
使用if和for的语句必须使用大括号把语句块括起来。
不同于其他编程语言,在JavaScript中,块不会作为变量的作用域。JavaScript只支持函数级作用域。因此,JSLint只接受作为function、if、switch、while、for、do和try语句一部分的块,其他的块都会标志为错误。
var只能声明一次,而且在使用之前必须声明。
JSLint会把出现在return、break、continue或throw语句后面的代码标志为不可达的代码。这些语句后面必须紧跟一个结束大括号。
对于JavaScript来说,JSLint是一个非常好的工具,因为它会教你一些好的JavaScript编码实践。由于JSLint能 把可能导致逻辑错误或其他未预见行为的部分标出来,因此可以减少调试时间。如果你调试一段JavaScript代码时遇到困难,可以试试JSLint。
规则
JSLint 执行代码质量检测的原理核心在于用户设定的规则集。JSLint 默认提供的规则集包含了 Web 开发人员多年积累下来的认为不好的开发风格,我们可以根据自己项目的需求选择构建一套特定的规则。JSLint 将根据它进行对 JavaScript 脚本的扫描工作,并给出相应的问题描述信息。规则的形式体现为多组键值对:[param:option],以规则名做键,对规则调用与否做值。例如规则:“plusplus:true”是不允许 ++ 和 -- 运算符的出现,“undef:true”是不允许使用未定义的变量。
由于 JSLint 工具本质上是一个普通的 JS 脚本,其运行也自然依赖于一个 JS 运行引擎,其被引擎加载后会在内存中产生一个全局 JSLint 函数对象,该函数对象需要两个输入量:source 和 options,前者用来指定待检测的脚本文件被解析后生成的字符串或字符串数组,后者则表示用户自定义的规则选项。若 options 为空,JSLint 则使用其默认的规则对 source 进行扫描检测。
整个检测过程就是对脚本中所含 JSLINT (source, options) 函数的一次执行过程。当指定的 source 脚本在 options 条件下检测通过,则 JSLint 返回 true,否则返回 false,而这时则可以通过 JSLINT.errors 对象获得详细的错误信息。图 1 展示了 JSLint 的整个工作过程。
过程图
如图1所示,规则集的配置方式有三种:
直接通过修改 JSLint.js 源码来修改默认规则。在 JSLint 函数运行时,同时设置 options 参数,动态改变其规则选项(first overwrite)。此方式适用于对批量 js 文件使用同样的一组自定义规则。通过在待检测的 js 文件头部添加注释类型的规则,对单个 js 文件添加适用于该文件代码的特殊规则(second overwrite)。此方式适用于对不同 js 文件设置特定的检测规则,通常用于在该文件中引入一些全局变量。
下面通过使用 JSLint 并结合不同规则,来对 JSLint 规则的适用范围和使用方法做一具体介绍。清单 1 是一段基于 dojo 的 JavaScript 代码。
使用
最简单直接的使用 JSLint 的方式是下载 Rhino,以命令行方式直接对特定 JavaScript 脚本进行语法检查。Rhino 是 Mozilla 提供的纯 Java 实现的开源 JavaScript 引擎,可在 java 环境中为 JavaScript 提供运行环境。读者可以在 下载 Rhino。
整个过程可以分为如下几个步骤:
确定自定义规则集:这里只使用一个 var 定义所有的变量、不允许使用 ++/-- 运算符、不允许使用 == 运算符,形成的 options:{onevar:true, plusplus:true, eqeqeq=true}。解压 rhino 压缩包,里面包含了 rhino(js.jar) 和 jslint(jslint.js),我们将 js.jar 添加的操作系统的 classpath 里,方便随处执行;并将 jslint.js 和 test.js 放在一起(当然也可以不放在一起,之后执行的时候键入不同的路径即可)。添加 options 到 JSLint:我们可以选择修改 JSLint 源码或是在待检测的 JavaScript 文件头部添加注释型规则。JSLint.js 源码片段在 536 行 if 语句之后:!JSLINT(input, {[options]}) 是 JSLint 的执行方法,我们的 options 就放在红色方框所在位置;如果要在待测文件头部添加注释类型规则,更加简单,将如下格式的注释添加到待检测 JavaScript 脚本文件顶部即可: /*jslint onevar:true, plusplus:true, eqeqeq=true */
需要指出的是,rhino 包里面提供的 jslint.js 并非原始的 jslint,而是修改过的压缩版本,它在文件最后添加了用于修改 options 的 JavaScript 代码,这也正是我们添加自定义规则的切入点。
打开 DOS 命令行,键入如下命令(将 JSLlint.js 和 test.js 放到当前命令行路径下)
java org.mozilla.javascript.tools.shell.Main jslint.js test.js
整合
Ant 是 Java 开发中常见构建工具之一,通过 Ant 进行项目的持续构建,能及时发现项目代码中存在问题,保证交付质量。服务器端 Java 代码在持续构建过程中的代码检测工具已经十分成熟,例如
findbugs,而客户端代码的检测工作往往被忽略,下面我们将详细介绍如何在 Ant 中配置一项 JSLint 检测任务来完成客户端代码的检测任务。
jslint4java 是一款用来驱动 JSLint 在 rhino 引擎下检测 JavaScript 代码的开源 Java 工具,它相当于一个检测过程的容器。而 jslint4java_ant 则负责将 jslint4java 作为 Ant 任务来调用,能够支持用户自定义 options 以及多文件同时检测的功能。
这里将首先创建一个示例项目作为 Ant 测试环境,首先将 jslint4java、jslint4java-ant、rhino 三个包添加到类路径,建立待检测的 JS 文件夹:JSFiles,并且把需要检测 JS 文件添加到该文件夹当中,添加 build.xml(如清单 3 所示)并添加 JSLint 任务,这里我们忽略常见的 Java 编译打包任务。
参考资料
学习
JSLint 官方网站,详细了解 JSLint 规则、在线检测 JS 代码。
Jslint4java 说明文档,了解 JSLint task 在 Ant 中的配置方法。
实用的 JavaScript 测试及效验工具,常用的 JavaScript 检测工具。
Rhino 简介,rhino 的下载和帮助说明文档。
developerWorks Web development 专区:通过专门关于 Web 技术的文章和教程,扩展您在网站开发方面的技能。
developerWorks Ajax 资源中心:这是有关 Ajax 编程模型信息的一站式中心,包括很多文档、教程、论坛、blog、wiki 和新闻。任何 Ajax 的新信息都能在这里找到。
查看HTML5 专题,了解更多和 HTML5 相关的知识和动向。