【51CTO獨(dú)家譯文】JavaScript已經(jīng)流行好多年了，作為一門(mén)Web頁(yè)面上客戶(hù)端腳本語(yǔ)言，它獲得了廣泛的成功。對(duì)于每個(gè)Web開(kāi)發(fā)者來(lái)說(shuō)，它都是一門(mén)需要了解和使用的語(yǔ)言。這里總結(jié)的31個(gè)最實(shí)用的JavaScript工具可以級(jí)大地提高開(kāi)發(fā)速度，減少調(diào)試和測(cè)試的時(shí)間，改善輸出的質(zhì)量。

下面提到的這些工具包括各種實(shí)用工具，優(yōu)化器，測(cè)試和調(diào)試工具，它們可以提高開(kāi)發(fā)者創(chuàng)建Web站點(diǎn)的效率。

1，JavaScript compressor and comparison tool

有許多工具可以幫助你壓縮JavaScript代碼，但是這個(gè)過(guò)程比較耗時(shí)，并且，對(duì)于某個(gè)特定的場(chǎng)景來(lái)說(shuō)，很難分析出具體哪個(gè)工具表現(xiàn)的最好。這個(gè)應(yīng)用程序可以對(duì)那些工具的常規(guī)壓縮做一個(gè)匯總統(tǒng)計(jì)，它可以讓開(kāi)發(fā)者在不安裝這些工具的情況下，對(duì)在自己的JavaScript代碼上應(yīng)用那些工具的情況進(jìn)行比較。

具體可以參考：http://compressorrater.thruhere.net/

2，Regular expression validator tool

這個(gè)基于Web的JavaScript正則表達(dá)式驗(yàn)證器可以讓你輕松地為JavaScript測(cè)試和編寫(xiě)正則表達(dá)式。這個(gè)工具可以幫助你檢查語(yǔ)法方面的錯(cuò)誤，此外，它還為你提供一個(gè)正則表達(dá)式庫(kù)。

具體可以參考：http://tools.netshiftmedia.com/regexlibrary/

3，Regular expression generator

在IE中，這個(gè)腳本運(yùn)行在 JDC 1.0.3 之上，這就是它在 Firefox，Opera 和 Safari 上運(yùn)行的稍微快一些的原因。

具體可以參考：http://www.jslab.dk/tools.regex.php

4，Jsbeautifier

這個(gè)微型的美化器可以重新調(diào)整 bookmarklet 和丑陋的JavaScript的格式和縮進(jìn)，也可以對(duì)使用流行的 Dean Edward 的 Packer 打包的腳本進(jìn)行拆包，對(duì)通過(guò)javascriptobfuscator.com 混淆的腳本進(jìn)行反混淆。

具體可以參考：http://jsbeautifier.org/

5，Jsbin

JS Bin是一個(gè)開(kāi)源的，協(xié)同的JavaScript調(diào)試工具。

具體可以參考：http://jsbin.com/

#p#

6，Jslint

JSlint會(huì)對(duì)JavaScript的源代碼進(jìn)行掃描。如果它發(fā)現(xiàn)了一個(gè)問(wèn)題，會(huì)返回一個(gè)描述這個(gè)問(wèn)題的消息和源代碼中的大概位置。這個(gè)問(wèn)題不一定是一個(gè)語(yǔ)法錯(cuò)誤（雖然通常情況下，這個(gè)問(wèn)題都是一個(gè)語(yǔ)法錯(cuò)誤）。JSLint 會(huì)發(fā)現(xiàn)一些樣式約定和結(jié)構(gòu)問(wèn)題。它無(wú)法證明你的程序是正確的。它只能幫助你發(fā)現(xiàn)一些問(wèn)題。

具體可以參考：http://www.jslint.com/

7，Rockstarapps

Rockstarapps 的使命比較簡(jiǎn)單：給開(kāi)發(fā)者提供一套工具，讓他們可以在云中創(chuàng)建經(jīng)過(guò)高度優(yōu)化的Web應(yīng)用程序。

具體可以參考：http://rockstarapps.com/joomla-1.5.8/home.html

8，Prettyprinter

這是一個(gè)源代碼美化器（源代碼格式化器），和縮進(jìn)的效果是類(lèi)似的。

具體可以參考：http://www.prettyprinter.de/

9，Pixastic

Pixastic是一個(gè)實(shí)驗(yàn)性的庫(kù)，使用這個(gè)庫(kù)，你只需要一點(diǎn)點(diǎn)的 JavaScript 代碼，就可以執(zhí)行各種圖像操作。它支持的效果包括淡化/灰度調(diào)整，倒置，翻轉(zhuǎn)，亮度/對(duì)比度的調(diào)整，色調(diào)/飽和度，浮現(xiàn)，模糊，等等。

具體可以參考：http://www.pixastic.com/

10，Extjs

構(gòu)建豐富的，可持續(xù)發(fā)展的Web應(yīng)用程序比以往更加快捷了。許多著名的公司（Adobe, Amazon, CNN 等）都在使用extjs。

具體可以參考：http://www.sencha.com/   

#p#

11，Slickspeed

各種測(cè)試在一個(gè)中立的環(huán)境中運(yùn)行，在主要的JavaScript測(cè)試中，既不包括庫(kù)也不包括框架，這樣可以避免偏頗。

具體可以參考：http://mootools.net/slickspeed/

12，Scriptalizer

對(duì)于那些在互聯(lián)網(wǎng)上部署和傳輸?shù)慕忉屝哉Z(yǔ)言（例如：JavaScript）來(lái)說(shuō)，對(duì)源代碼進(jìn)行最小化是很有幫助的，因?yàn)檫@可以減少需要傳輸?shù)臄?shù)據(jù)量。

具體可以參考：http://www.scriptalizer.com/

13，Yui compressor

YUI Compressor 是100%安全的 JavaScript 最小化器，它比大多數(shù)其他工具的壓縮比都要高。在YUI庫(kù)上的測(cè)試表明，和 JSMin 比起來(lái)，它可以節(jié)省超過(guò)20%的體積（在HTTP壓縮以后，這個(gè)數(shù)字是10%）。

具體可以參考：http://developer.yahoo.com/yui/compressor/

14，Js minifier

具體可以參考：http://fmarcia.info/jsmin/test.html

15，Jslitmus

JSLitmus 是一個(gè)輕量級(jí)的工具，主要用于創(chuàng)建 ad-hoc JavaScript benchmark tests。

具體可以參考：http://broofa.com/Tools/JSLitmus/

#p#

16，Js regular expression tester

這個(gè)方便的實(shí)用程序可以在一個(gè)瀏覽器中，使用 JavaScript 來(lái)測(cè)試 JavaScript 正則表達(dá)式。它的界面和其他正則表達(dá)式測(cè)試工具類(lèi)似，但是，和其他工具不同的是，它用JavaScript 測(cè)試正則表達(dá)式的 JavaScript 實(shí)現(xiàn)。

具體可以參考：http://www.codeproject.com/KB/scripting/regex2.aspx

17，Qooxdoo

qooxdoo是一個(gè)集綜合性和創(chuàng)新性于一身的框架，它主要用于創(chuàng)建富互聯(lián)網(wǎng)應(yīng)用程序（RIA）。面向?qū)ο蟮?JavaScript 可以讓開(kāi)發(fā)者構(gòu)建跨瀏覽器的應(yīng)用程序。無(wú)須掌握HTML, CSS的知識(shí)，也無(wú)須掌握 DOM 知識(shí)。

具體可以參考：http://qooxdoo.org/

18，JavascriptMVC

JavascriptMVC是一個(gè)開(kāi)源的框架，它融合了企業(yè)級(jí)的 JavaScript 開(kāi)發(fā)方面的最佳理念。它可以通過(guò)執(zhí)行最佳實(shí)踐，增加可維護(hù)性，和推廣約定優(yōu)于配置的理念等方式來(lái)幫助你成功地完成項(xiàng)目。

具體可以參考：http://javascriptmvc.com/

19，GNUcitizen

為了把JavaScript攻擊向量和其他的客戶(hù)端和服務(wù)端技術(shù)組合在一起，AttackAPI提供了簡(jiǎn)單而直觀(guān)的編程界面。

具體可以參考：http://www.gnucitizen.org/blog/attackapi/

20，Jsfuzzer

這個(gè) fuzzing 工具支持事件，標(biāo)簽，樣式和 HTML 屬性的 fuzzing。你可以使用各種深度的不完整標(biāo)簽，也可以對(duì)所有參數(shù)進(jìn)行隨機(jī)排列。它還包含一個(gè)帶有所有新的攻擊向量的數(shù)據(jù)庫(kù)。

具體可以參考：http://code.google.com/p/jsfuzzer/

#p#

21，J3unit

J3Unit是一個(gè)面向?qū)ο蟮?JavaScript 單元測(cè)試框架。J3Unit可以直接在Web瀏覽器中運(yùn)行JavaScript測(cè)試，也可以自動(dòng)地運(yùn)行 JUnit 和Jetty。J3Unit是建立在JSUnit 和 Script.aculo.us 基礎(chǔ)之上的，它提供了一種更好的方式來(lái)自動(dòng)化JavaScript單元測(cè)試。

具體可以參考：http://j3unit.sourceforge.net/

22，Jsunit

JsUnit是一個(gè)客戶(hù)端（瀏覽器內(nèi)）JavaScript單元測(cè)試框架。它實(shí)際上是JUnit到JavaScript的一個(gè)通道。此外，它還包括一個(gè)平臺(tái)，這個(gè)平臺(tái)可以自動(dòng)地執(zhí)行多個(gè)瀏覽器和運(yùn)行不同的操作系統(tǒng)的多臺(tái)機(jī)器上的測(cè)試。

具體可以參考：http://www.jsunit.net/

23,Firebug

Firebug是和 Firefox 集成在一起的，當(dāng)你瀏覽頁(yè)面的時(shí)候，你隨時(shí)可以使用它提供的豐富的Web開(kāi)發(fā)工具。在任何一個(gè)Web頁(yè)面中，你都可以實(shí)時(shí)地編輯，調(diào)試和監(jiān)控 CSS，HTML，和JavaScript。

具體可以參考：http://getfirebug.com/

24，Venkman

Venkman 是 Mozilla 的 JavaScript 調(diào)試器的代號(hào)。Venkman 旨在為基于 Gecko 的瀏覽器（即：Firefox 3.x,Netscape 7.x 系列的瀏覽器）提供一個(gè)強(qiáng)大的 JavaScript 調(diào)試環(huán)境。

具體可以參考：http://www.mozilla.org/projects/venkman/

25，Drosera

為了調(diào)試你的應(yīng)用程序中的 JavaScript 代碼，你需要為你的應(yīng)用程序指定一個(gè)默認(rèn)的“bundle identifier”。此外，你還需要使用 TOT WebKit 框架來(lái)發(fā)布你的應(yīng)用程序。通過(guò) WebKitTools/Scripts 內(nèi)的 run-webkit-app 腳本，你可以輕松地完成這些工作，然后，你會(huì)發(fā)現(xiàn)你的應(yīng)用程序已經(jīng)顯示在 Drosera 的窗口中了。

具體可以參考：http://webkit.org/blog/61/introducing-drosera/

#p#

26，Dragonfly

歡迎 Opera Dragonfly 的 alpha版的到來(lái)，這是一個(gè)為基于 Presto 的 Opera 瀏覽器而提供的功能完備的調(diào)試環(huán)境。Opera Dragonfly 提供的那些工具可以讓你更快速，更輕松地進(jìn)行開(kāi)發(fā)，它們可以調(diào)試你的 JavaScript 代碼，也可以檢查DOM，CSS，網(wǎng)絡(luò)流量和數(shù)據(jù)存儲(chǔ)。Opera Dragonfly 內(nèi)置的遠(yuǎn)程調(diào)試功能讓移動(dòng)開(kāi)發(fā)變得前所未有的輕松。

具體可以參考：http://www.opera.com/dragonfly/

27，Nitobibug

對(duì)于專(zhuān)家和新手來(lái)說(shuō)，NitobiBug 都是一個(gè)實(shí)用的工具。它讓 JavaScript 和 DOM 問(wèn)題的調(diào)試變得更加快捷，更加簡(jiǎn)單。

具體可以參考：http://www.nitobibug.com/

28，Wavemaker

具體可以參考：http://www.wavemaker.com/

29，Jaxer

Jaxer是一個(gè) Aptana Ajax Server，它內(nèi)置在 Aptana Studio 中。Jaxer可以讓你在提供那個(gè)頁(yè)面以前或者是在回調(diào)期間，在服務(wù)器上執(zhí)行 JavaScript 代碼。

具體可以參考：http://jaxer.org/

30，Jxlib

一個(gè) JavaScript 庫(kù)，主要用于創(chuàng)建基于傳說(shuō)中的 MooTools 庫(kù)的圖形化的用戶(hù)界面。

具體可以參考：http://jxlib.org/

31，Dojotoolkit

Dojo 可以節(jié)省你的時(shí)間，提供強(qiáng)大的性能，縮短你的開(kāi)發(fā)過(guò)程。為了提供良好的Web體驗(yàn)，有經(jīng)驗(yàn)的開(kāi)發(fā)人員都會(huì)使用這個(gè)工具包。

具體可以參考：http://www.dojotoolkit.org/

原文名：31 Useful Javascript tools for developers      周雪峰 譯

原文鏈接：http://www.mostinspired.com/blog/2010/06/19/31-useful-javascript-tools-for-developers/

【編輯推薦】

1. 雕蟲(chóng)無(wú)小技 JavaScript初學(xué)者的10個(gè)迷你技巧
2. 10個(gè)自由豐富的jQuery或JavaScript編輯器
3. 沒(méi)有JavaScript，你的網(wǎng)頁(yè)會(huì)是啥樣？
4. 20個(gè)令人恐怖的JavaScript導(dǎo)航技術(shù)
5. 誰(shuí)會(huì)成為下一個(gè)jQuery？十大最新JavaScript框架逐個(gè)看