JavaScript Eclipse 插件助您一臂之力，提高 JavaScript 生產(chǎn)力指日可待
JavaScript Development Toolkit（JSDT）是一種開放源碼插件，它將健壯的 JavaScript 編程工具引入到 Eclipse 平臺中。JSDT 使開發(fā)更加流暢、簡化了編碼并提高了純 JavaScript 源文件和 HTML 內(nèi)置的 JavaScript 的生產(chǎn)力。
JavaScript 開發(fā)并不容易。瀏覽器兼容性參差不齊、文檔非常糟糕、工具貧乏，這些因素使問題進一步惡化。幸運的是，隨著最近針對 Eclipse 的插件集 JavaScript Development Toolkit（JSDT）的發(fā)布，工具匱乏的局面有望得到改善。
Eclipse 是一個開源的 IDE 框架，具有提高擴展性和靈活性的架構(gòu)。JSDT 作為插件在 Eclipse 中運行。在 Eclipse 中，JavaScript 并不是什么新鮮的概念，因為已經(jīng)可以從其他插件獲得 HTML 和一些 JavaScript 支持，但是 JSDT 的獨特之處在于其所提供的工具的健壯性和復(fù)雜性，這可顯著提高 Web 開發(fā)的生產(chǎn)力。
JSDT 提供的許多特性和核心設(shè)計都可以在 Java Development Toolkit（JDT）中找到。JSDT 將要代替 Web Tools Platform V3.0 發(fā)行版中當(dāng)前的 JavaScript 編輯器。
IDE 和 JavaScript
您可能想知道為什么 JavaScript IDE 會如此流行。隨著 Web 2.0 的流行以及大量開發(fā)人員都熱衷于在博客和社區(qū)頁面中使用 JavaScript，大量新的 JavaScript 工具不斷出現(xiàn)。盡管如此，Notepad 和瀏覽器的 Refresh 按鈕仍然是大多數(shù)程序員首選的 JavaScript 開發(fā)環(huán)境。
問題在于 JavaScript 語言的解釋性。與 Java™ 或 C 語言不同，JavaScript 是一種松類型的語言，并且很難實現(xiàn)精確建模。對于較為正式的語言，需要優(yōu)先考慮已編譯代碼的效率，并且對語言的靈活性有所限制。JavaScript 的目標則不一樣。各種因素試圖分化趨向同一個平臺的開發(fā)人員，這導(dǎo)致了語言的不一致性。從工具和開發(fā)的角度來看，這些不一致性使問題更加復(fù)雜。
瀏覽器并不是惟一的問題。面向?qū)ο蟮?JavaScript 是一種補充而不是關(guān)注的焦點。Ajax 工具箱努力使 JavaScript 朝面向?qū)ο蠓矫孓D(zhuǎn)變 — 但是各自采取不同的方式。這可能會使標識對象和類結(jié)構(gòu)變得很困難。這種語言有幾個嚴重的漏洞，程序員利用它們實現(xiàn)一些使用其他方式難以實現(xiàn)的技巧，這使問題更加嚴重（或者更好，取決于您詢問的對象）。其中一個例子是將主要的代碼塊封裝到一個 evalf(..) 函數(shù)中，使它只在運行時有效。我們目前仍然在克服這個問題，以便在 JSDT 中精確建模。
現(xiàn)有的 JavaScript IDE
目前可以使用一些并不完整的 JavaScript 工具。但是很多流行的工具還不能提供真正的上下文感知內(nèi)容幫助，因為它們?nèi)鄙僬嬲?JavaScript 語言建模機制。在模型較少的 IDE 中，通過使用靜態(tài)平面文件列出可用的類型，可以實現(xiàn)內(nèi)容完成和工具功能。這些類型根據(jù)輸入的部分字符動態(tài)調(diào)整，并且通常不會選擇代碼中定義的對象成員。內(nèi)容完成對上下文不敏感，因為如果沒有模型的話，可實現(xiàn)的功能將受到很大限制。
如果沒有語言模型，則很難或者不可能將代碼放入到上下文中。由于很多編程元素都依賴于代碼的上下文，因此使用工具建立上下文十分重要。缺少模型和代碼上下文的 IDE 同樣也會缺少充分的類型解析和驗證、作用域、可視性，或者其他任何對簡化開發(fā)非常重要的良好驗證功能。
JSDT 設(shè)計
圖 1. JSDT 語言抽象棧
JSDT 對 JavaScript 語言建模并實時隱含類結(jié)構(gòu)，這通過一種全新的方式來實現(xiàn)。首先，構(gòu)建基本的語言元素。其次，推理引擎或引擎幫助填補所有類結(jié)構(gòu)和語言差異。
基本語言模型
可以將推理和建模流程看作一個操作棧。模型的開始部分是 JavaScript 源代碼。通過使用類似 Eclipse JDT 的引擎，將源代碼轉(zhuǎn)換為私有的語言模型。語言的純模型遵守 ECMA-3 標準。
類型和類推理
對 JavaScript 語言建模后，下一步是管理類型和類推理。許多基于 JavaScript 的工具箱（例如 Dojo、Rico、Prototype）通過自己的技術(shù)使 JavaScript 面向?qū)ο缶幊谈臃奖恪SDT 使用定制的、工具箱感知的推理引擎在工具箱內(nèi)部識別類和類型結(jié)構(gòu)。這些類和類型隨后可以添加到語言模型中。
公開模型
最后，將私有模型及其推理部分轉(zhuǎn)換為公共語言模型。公共語言模型可用于源代碼、重構(gòu)和 as-you-type 工具。如果其中一種工具需要修改一些 JavaScript 源代碼，就得先在公共模型中進行修改，并最終轉(zhuǎn)換到 JavaScript 源代碼。
管理變量和成員作用域
即使語言模型為描述 JavaScript 源代碼和上下文提供了基礎(chǔ)，還需要另外一個重要因素：環(huán)境上下文。JSDT 必須在運行 JavaScript 的全局作用域時建立可用的變量和類型。這些變量和類型根據(jù) JavaScript 的運行時環(huán)境而有所不同。當(dāng) JavaScript 在 Web 瀏覽器上下文中運行時，對象、類型、表示屏幕數(shù)據(jù)的字段以及瀏覽器對象在全局作用域中都是可用的。如果代碼是針對其他內(nèi)容而不是瀏覽器，那么整個對象集可能會不同。
圖 2. JSDT 庫配置
JSDT 使用庫機制管理項目中的通用對象、變量和類型。可以將庫添加到項目中，以提供特定于用戶目標運行時環(huán)境的對象和變量集。如果存在兩個定義沖突成員的庫，則在相應(yīng)的用戶接口中聚合并注釋這些成員。這有助于創(chuàng)建在瀏覽器或環(huán)境之間通用的方法。
為流行的瀏覽器預(yù)打包庫非常簡單。庫被捆綁在一個插件中，該插件包含有定義對象和類型的 JavaScript 源文件。當(dāng) JSDT 對源代碼編輯器中打開的文件進行建模時，它首先對文件的源代碼建模，然后將項目的庫集合中的所有源文件添加到模型。庫源文件永遠不會進行驗證，只用于定義對象結(jié)構(gòu)、附加在懸浮式幫助和內(nèi)容完成中可見的 JsDoc。
雖然庫的主要功能是管理 JavaScript 的運行時上下文，但是它還提供了另一個重要特性 — 處理源文件交叉引用。純 JavaScript 不具備顯式的 include 函數(shù)。開發(fā)人員的一個不良習(xí)慣就是將函數(shù)散布到多個源文件中。庫配置頁面可以幫助管理源文件之間的交叉項目可見性。如果某個項目文件夾被標記為一個源文件，那么該文件夾中的所有 JavaScript 將包括在全局作用域中。使用 exclude 模式可以限制文件夾。
工具
撇開較高層的設(shè)計不談，我們仔細看看這些特性。JSDT 的一些可視性較弱但非常重要的特性包括：相同文字突出顯示、自動閉合大括號（以及圓括號、引號）以及自動縮進等。因此可以說，“只要是良好 IDE 應(yīng)該具備的，JSDT 都提供支持”。
圖內(nèi)容幫助
圖 3. 內(nèi)容幫助
內(nèi)容完成可以通過 Ctrl+Space 鍵任意調(diào)用。圖 3 展示了內(nèi)容幫助調(diào)用文檔對象。內(nèi)容完成對上下文敏感，并且基于全局作用域和 JavaScript 模型。完成條目顯示字段名、字段類型和字段的聲明類型。
檢測和糾正錯誤
如果 IDE 可以主動確定代碼錯誤，它將非常有用。JSDT 可以檢測三種主要錯誤類型：語法/語言錯誤、類型/字段/方法可視性、流或邏輯錯誤。所有的錯誤警告級別都可以通過首選項頁面進行單獨配置。
圖 4. 未解析的方法
JSDT 試圖解析對象的所有字段和方法。未解析的方法則標記為錯誤。
圖 5. 語法錯誤
JSDT 還可以查找并標記語法錯誤。下面的 for() 語句丟失了一個分號。
圖 6. 流分析
圖 6 演示了流分析。由于 return 語句后面的所有代碼都不能執(zhí)行，因此將其標記為錯誤。
圖 7. 快速修復(fù)
一些錯誤具有快速修復(fù)選項。在圖 7 中，當(dāng)用戶單擊未解析變量 formyValue 旁邊的錯誤標記時，JSDT 將顯示一些糾正錯誤的選項。
代碼格式化
源代碼有時會混亂。您可能期望易于閱讀、結(jié)構(gòu)良好、格式化良好的代碼。這就需要在進行開發(fā)和調(diào)試時對代碼進行格式化。JSDT 支持許多 as-you-type 格式化特性，比如可配置自動縮進和字符成對匹配。這些特性都有助于加快開發(fā)和提高可讀性。
如果您收到的代碼非常混亂，該怎么辦？只需要單擊一下鼠標，JSDT 代碼格式化程序就可以整理并重新格式化混亂的 JavaScript 代碼。格式化引擎是高度可配置的，因此可以導(dǎo)出配置供團隊共享。
其他 JSDT 特性
上面列出的僅是 JSDT 支持的特性的一部分。下面列出非常簡單但必須具備的 JSDT 特性：
- 語法突出顯示
- 折疊/行號
- 完整描述、顯示類、函數(shù)和字段
- 突出顯示并檢查大括號/圓括號匹配
- 自動完成大括號、圓括號和縮進
- 標記出現(xiàn)位置
- 注釋切換（行或塊）
- 生成元素 JsDoc
- 用 do，for，try/catch，while 包圍
- 用戶可配置的完成模板
- 提取函數(shù)/修改函數(shù)簽名
- 縮排糾正
- 打開聲明
- 開放類型結(jié)構(gòu)
- 開放調(diào)用結(jié)構(gòu)
- 可定制的代碼格式化
- 全搜索
- 重構(gòu)/重命名/移動
- 斷點支持
- 使用 JsDoc 為 Firefox、Internet Explorer 和 ECMA-3 定義瀏覽器庫
- 通過 JsDoc + JavaScript 原型定義支持用戶定義的庫
- 庫映像支持
- ATF Project 提供的調(diào)試支持
結(jié)束語
如果需要一種免費的 Web 開發(fā)環(huán)境，請選擇 Eclipse。由于新增了 JSDT，Eclipse 的 JavaScript 能力超越了市場上其他同類產(chǎn)品。開放源碼項目促成了 JSDT 的快速發(fā)展，JSDT 將像 JavaScript 一樣快速地演進。
參考資料
學(xué)習(xí)
獲得產(chǎn)品和技術(shù)
討論
關(guān)于作者
 |
|
|
|
Bradley Childs 2004 年畢業(yè)于 Texas A&M University。他在 IBM 從事中間件開發(fā)，后來又轉(zhuǎn)到新興技術(shù)方面。他和 Phil Berkland 密切合作開發(fā) JSDT。他在 Ajax Tooling Framework 項目社區(qū)中非常活躍。
|
http://www.spitv.net
http://goku.spitv.net
http://sxin99.com
posted on 2008-07-18 22:58
GoKu 閱讀(1947)
評論(5) 編輯 收藏