使用JSLint提高JS代码质量

随着富 Web 前端应用的出现,开发人员不得不重新审视并重视 JavaScript 语言的能力和使用,抛弃过去那种只靠“复制 / 粘贴”常用脚本完成简单前端任务的模式。JavaScript 语言本身是一种弱类型脚本语言,具有相对于 C++ 或 Java 语言更为松散的限制,一切以函数为中心的函数式编程思想也为开发人员提供了更加灵活的语法实现。然而,这种灵活性在带来高效的同时,也成为初学或者经验不足的 JavaScript 开发人员的噩梦。形式各异的代码风格、隐含错误的代码行为,严重影响了整体代码的可读性和稳定性,成为 Web 项目中最为常见问题之一。

 

因而,我们需要一个有效的 JavaScript 代码质量工具,以便能及时发现并修正 JavaScript 代码中所隐含的问题,保证代码交付质量。JSLint 作为一个灵活有效的 JavaScript 代码质量检测工具,允许使用者指定满足其特定应用开发需求的编码风格约定,使得整个项目的风格统一,这种“规则”(options)驱动的工作方式使得 JSLint 能够适用于不同的代码检测需求。本文将首先向读者介绍 JSLint 的基本概念和作用,讲解其基于规则的工作方式,而后通过一个示例阐明其基本的使用方法,最后介绍如何将 JSLint 整合到 Ant 和 Eclipse 的应用过程,以全方面展示如何将 JSLint 在日常开发任务中加以运用。

 

什么是 JSLint

JavaScript 作为一门年轻、语法灵活多变且对格式要求相对松散的语言,代码格式的混乱和某些语言特性的不正确使用,往往使得最终交付的产品中包含许多因编码风格约定造成的未预见的行为或错误,这种习惯性的问题如果不及时指出并修改,往往会在项目的迭代过程中不断的重现,严重影响 Web 产品的稳定性与安全性。JSLint 正是 Douglas Crockford 同学为解决此类问题创建的工具,JSLint 除了能指出这些不合理的约定,还能标出结构方面的问题。虽然 JSLint 不能保证代码逻辑一定正确,但却有助于发现错误并教会开发人员一些好的编码实践。值得一提的是 JSLint 工具本身也是一段 JavaScript 代码,它是检验 JavaScript 代码质量的 JavaScript 脚本。JSLint 对 JavaScript 脚本的质量检测主要包括以下几个方面:

  • 检测语法错误:例如大括号“{}”的配对错误。
  • 变量定义规范:例如未定义变量的检测。
  • 代码格式规范:例如句末分号的缺失。
  • 蹩脚语言特性的使用检测:如 eval 和 with 的使用限制。

JSLint 的版本更新一直处于活跃状态,截至本文撰写之时,JSLint 最新版本的发布时间为 2010-10-10。很多主流代码编辑器均对 JSLint 提供了良好的扩展支持,包括 Eclipse、VS2008 等等。

目前,与 JSLint 功能类似的 JavaScript 代码检测工具有很多,包括:YUI Test、Firebug、MS Script Debugger 、CompanionJS 等等,它们中大多数都是以浏览器插件的形式存在于客户端浏览器进行 JavaScript 运行时的检测和调试,JSLint 与这些工具的重要区别在于其更加注重静态代码格式的检测,而这也正是当前火热的敏捷开发中持续构建所需要和提倡的。

 

认识 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 工作过程示意图

图 1. JSLint 工作过程示意图

如图所示,规则集的配置方式有三种:

  1. 直接通过修改 JSLint.js 源码来修改默认规则。
  2. 在 JSLint 函数运行时,同时设置 options 参数,动态改变其规则选项(first overwrite)。此方式适用于对批量 js 文件使用同样的一组自定义规则。
  3. 通过在待检测的 js 文件头部添加注释类型的规则,对单个 js 文件添加适用于该文件代码的特殊规则(second overwrite)。此方式适用于对不同 js 文件设置特定的检测规则,通常用于在该文件中引入一些全局变量。
  1. http://www.cnblogs.com/sosoft/

转载于:https://www.cnblogs.com/sosoft/p/3474936.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/473753.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Django工具:Git简介与基本操作

1.Git简介: 1.Git是目前世界上最先进的分布式版本控制系统 网址:http://github.com 2.总结git的两大特点: 版本控制:可以解决多人同时开发的代码问题,也可以解决找回历史代码的问题 分布式:Git是分布式…

用户画像系统应用

用户画像系统应用 1 用户信用等级分级 比如在银行根据分级决定给用户贷款的额度,以及贷款的时长,那么怎么对用户分级呢?首先收集大量用户的数据,包括基本属性信息以及用户在使用银行的借记卡,信用卡等等。如果是运营…

SVN或其他网盘类软件同步图标不显示的异常

因为Windows Explorer只支持15个ShellIcon显示 所以有些软件为了正常显示其同步状态,就会通过修改自己的ShellIcon名称来抢占这15个名额 只需在注册表中修改下他们的名称,并将所需要展示的Icon的名称顺序提前 重启Explorer进程即可: HKEY_L…

LeetCode 1616. 分割两个字符串得到回文串

文章目录1. 题目2. 解题1. 题目 给你两个字符串 a 和 b ,它们长度相同。 请你选择一个下标,将两个字符串都在 相同的下标 分割开。 由 a 可以得到两个字符串: aprefix 和 asuffix ,满足 a aprefix asuffix ,同理&am…

Kafka基础

Kafka基础 1 消息队列 1.1 什么是消息队列 消息队列(MQ):消息队列,保存消息的队列。消息的传输过程中的容器;主要提供生产、消费接口供外部调用做数据的存储和获取。 1.2 为什么要有消息队列 当网站面对教大的流量…

系统总结学习 Python 的 14 张思维导图

本文主要涵盖了 Python 编程的核心知识(暂不包括标准库及第三方库)。 首先,按顺序依次展示了以下内容的一系列思维导图:基础知识,数据类型(数字,字符串,列表,元组&#x…

LeetCode 1617. 统计子树中城市之间最大距离(枚举所有可能+图的最大直径)

文章目录1. 题目2. 解题1. 题目 给你 n 个城市,编号为从 1 到 n 。同时给你一个大小为 n-1 的数组 edges ,其中 edges[i] [ui, vi] 表示城市 ui 和 vi 之间有一条双向边。 题目保证任意城市之间只有唯一的一条路径。换句话说,所有城市形成了…

HighCharts解析之xAxis——x轴的样式

xAxis:x轴选项 参数 描述 默认值 allowDecimals 轴上的刻度是否允许使用小数 true alternateGridColor 当使用备用的网格颜色时,表格会各行变色 null categories x轴的名称。比如 categories: [Apples, Bananas, Oranges] [] dateTimeLabe…

MYSQL电脑客户端免安装教程以及出现问题解决方案

准备工作:window 7 64位旗舰版 MySQL 5.6.35免安装。 1. 下载MySQL 1.1 进入MySQL官网下载(https://www.mysql.com/)MySQL的安装包。 1.2. 根据自己电脑的位数(32位/64位)来下载响应的MySQL 、 2. 部署MySQL 2.1 解压压缩包到自己的某个盘…

Kafka高性能相关

Kafka高性能相关 1 高性能原因 1.1 高效使用磁盘 (1)顺序写磁盘,顺序写磁盘性能高于随机写内存 (2)Append Only 数据不更新,无记录级的数据删除(只会整个segment删除) &#xf…

Python面试总结(四)ip正则与三次握手四次挥手

1.请简述值传递和引用传递的区别?值传递仅仅传递的是值 引用传递,传递的是内存地址,修改后会改变内存地址对应储存的值。2.请手写一个匹配ip的正则表达式?第一种方法: ((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\…

Android相关sdk使用

SimpleDateFormat使用详解 Android_AlertDialog 两分钟彻底让你明白Android Activity生命周期(图文)!Android布局控件之LinearLayout详解Relative Layout如何正确地使用android中的progressdialog android的Menu使用android Toast大全(五种情形)建立属于…

[Kaggle] Digit Recognizer 手写数字识别(卷积神经网络)

文章目录1. 使用 LeNet 预测1.1 导入包1.2 建立 LeNet 模型1.3 读入数据1.4 定义模型1.5 训练1.6 绘制训练曲线1.7 预测提交2. 使用 VGG16 迁移学习2.1 导入包2.2 定义模型2.3 数据处理2.4 配置模型、训练2.5 预测提交Digit Recognizer 练习地址 相关博文: [Hands …

SparkCore基础

目录 Spark简介 1 什么是Spark 2 Spark特点 3 Spark分布式环境安装 3.1 Spark HA的环境安装 3.2 动态增删一个worker节点到集群 4 Spark核心概念 5 Spark案例 5.2 Master URL 5.3 spark日志的管理 5.4 WordCount案例程序的执行过程 6 Spark作业运行架构图&#xff…

python面试总结(五)内存管理与MYSQL引擎选择

1.python是如何进行内存管理的?当内存中有不再使用的部分时,垃圾收集器就会把他们清理掉 Python引入了机制:引用计数与分代回收。 Python提供了对内存的垃圾收集机制, 但是它将不用的内存放到内存池而不是返回给操作系统。 2.谈…

Codeforces 374A - Inna and Pink Pony

原题地址:http://codeforces.com/contest/374/problem/A 好久没写题目总结了,最近状态十分不好,无论是写程序还是写作业还是精神面貌……NOIP挂了之后总觉得缺乏动力精神难以集中……CF做的也是一塌糊涂,各种pretest passed fail…

LeetCode 1320. 二指输入的的最小距离(动态规划)

文章目录1. 题目2. 解题1. 题目 二指输入法定制键盘在 XY 平面上的布局如上图所示,其中每个大写英文字母都位于某个坐标处, 例如字母 A 位于坐标 (0,0),字母 B 位于坐标 (0,1),字母 P 位于坐标 (2,3) 且字母 Z 位于坐标 (4,1)。 …

Python面试常用二十题总结

1.请至少用一种方法下面字符串的反转? 1).A[::-1] 2).交换前后字母的位置 t list(A) l len(t) for i, j inzip(range(l - 1, 0, -1), range(l // 2)): t[i], t[j] t[j], t[i] return"".join(t) 3). 递归的方式, 每次输出一个字符 defstring_re…

SparkStreaming基础

目录 SparkStreaming基础 1 流式计算 1.1 常见的离线和流式计算框架 2 SparkStreaming简介 2.1 核心概念DStream 2.2 工作原理 2.3 Storm,SparkStreaming和Flink的对比 2.4 如何选择流式处理框架 3 SparkStreaming实时案例 3.1 StreamingContext和Receiver…

【Kaggle微课程】Natural Language Processing - 1. Intro to NLP

文章目录1. 使用 spacy 库进行 NLP2. Tokenizing3. 文本处理4. 模式匹配练习:食谱满意度调查1 在评论中找到菜单项2 对所有的评论匹配3 最不受欢迎的菜4 菜谱出现的次数learn from https://www.kaggle.com/learn/natural-language-processing 1. 使用 spacy 库进行…