快捷導(dǎo)航

如何利用JSHint減少JavaScript的錯(cuò)誤

更新時(shí)間：2016年08月23日 09:46:33 投稿：daisy

JSHint是一個(gè)社區(qū)驅(qū)動(dòng)用來檢測JavaScript代碼中錯(cuò)誤和潛在的問題以及執(zhí)行團(tuán)隊(duì)的編碼規(guī)范工具。它非常靈活,因此可以很容易地適應(yīng)您特定的編碼規(guī)則和你的代碼執(zhí)行環(huán)境。JSHint將永遠(yuǎn)保持開源的方式。

前言

JSHint用于分析和驗(yàn)證JavaScript代碼是否符合您的編碼規(guī)則。這個(gè)強(qiáng)大的工具可以幫助發(fā)現(xiàn)您代碼中錯(cuò)誤和問題T，它強(qiáng)制你的團(tuán)隊(duì)保持一定的編碼慣例和風(fēng)格，使得代碼可靠和更容易閱讀.

在這篇文章中,我將向您展示如何安裝、配置和使用JSHint。還包括一個(gè)例子，列出了一些我最喜歡的能使用JSHint的編輯器。

安裝 JSHint

安裝JSHint非常容易，你可以使用 Node 包管理器 (npm)來做。如果你還沒有安裝npm，你可以從 nodeJS website下載最新版，來安裝Node.js 和npm.

一旦安裝后npm，你就可以使用如下命令來安裝JSHint：

npm install jshint -g

-g 參數(shù)是告訴npm我們要全局安裝，這樣我們就能在任何目錄下調(diào)用這個(gè)命令。

通過命令行檢查代碼

現(xiàn)在JSHint 已經(jīng)安裝好了，讓我們?cè)诿钚蟹绞较率褂?code>jshint來分析一個(gè)JavaScript代碼文件。

下面是一個(gè)文件名為 demo1.json的文件:

我們使用如下命令來分析代碼：

jshint demo1.js

JSHint告訴我們?cè)赿emo1.js文件的第8行有一個(gè)錯(cuò)誤，原因：缺少一個(gè)分號(hào)。

如果我們補(bǔ)上缺少的分號(hào)，再次運(yùn)行這個(gè)命令，就不會(huì)有任何錯(cuò)誤信息輸出了。

配置JSHint

JSHint有一個(gè)默認(rèn)的配置來分析您的代碼，但它的配置設(shè)置被設(shè)計(jì)的非常靈活。有四種方式來為JSHint提供配置處理文件。

一種方式是使用 --config 參數(shù)來指定配置文件:

jshint demo1.js --config config.json

另一種方式是把配置放入一個(gè)叫.jshintrc的文件里, 因?yàn)?JSHint 會(huì)在同級(jí)目錄下搜索這個(gè)配置文件用于代碼分析，如果沒有找到，它會(huì)繼續(xù)上級(jí)目錄查找直到根目錄，這樣就允許我們對(duì)一個(gè)工程設(shè)置不同的配置文件。

第三種方式是在 package.json 文件的 jshintConfig 屬性下放入配置信息。

這三種方法中的任何一種,配置信息都是JSON格式指定每一個(gè)參數(shù)來告訴JSHint選項(xiàng)是打開或關(guān)閉。例如：在下面的配置文件中的“unused” 和“undef” 是來激活未使用和未定義變量的告警。 “curly” 要求您總是在循環(huán)和條件塊加上大括號(hào)。 “eqeqeq” 表示禁止使用 == 和!= 而應(yīng)該使用 === and !==.?！癵lobals” 用于指定沒有定義在代碼中的全局變量白名單。