|
<noscript></noscript> <noscript></noscript>
<script type="text/javascript">// --> // --></script>
<script type="text/javascript">// --> // --></script>
|
<!----><!----><!---->
|
级别: 中级
Bradley Childs (childsb@us.ibm.com ), 软件工程师, IBM
2008 年 7 月 14 日
JavaScript Development Toolkit(JSDT)是一种开放源码插件,它将健壮的 JavaScript 编程工具引入到 Eclipse 平台中。JSDT 使开发更加流畅、简化了编码并提高了纯 JavaScript 源文件和 HTML 内置的 JavaScript 的生产力。
<!----><!----><!---->
JavaScript 开发并不容易。浏览器兼容性参差不齐、文档非常糟糕、工具贫乏,这些因素使问题进一步恶化。幸运的是,随着最近针对 Eclipse 的插件集 JavaScript Development Toolkit(JSDT)的发布,工具匮乏的局面有望得到改善。
Eclipse 是一个开源的 IDE 框架,具有提高扩展性和灵活性的架构。JSDT 作为插件在 Eclipse 中运行。在 Eclipse 中,JavaScript 并不是什么新鲜的概念,因为已经可以从其他插件获得 HTML 和一些 JavaScript 支持,但是 JSDT 的独特之处在于其所提供的工具的健壮性和复杂性,这可显著提高 Web 开发的生产力。
JSDT 提供的许多特性和核心设计都可以在 Java Development Toolkit(JDT)中找到。JSDT 将要代替 Web Tools Platform V3.0 发行版中当前的 JavaScript 编辑器。
IDE 和 JavaScript
您可能想知道为什么 JavaScript IDE 会如此流行。随着 Web 2.0 的流行以及大量开发人员都热衷于在博客和社区页面中使用 JavaScript,大量新的 JavaScript 工具不断出现。尽管如此,Notepad 和浏览器的 Refresh 按钮仍然是大多数程序员首选的 JavaScript 开发环境。
问题在于 JavaScript 语言的解释性。与 Java™ 或 C 语言不同,JavaScript 是一种松类型的语言,并且很难实现精确建模。对于较为正式的语言,需要优先考虑已编译代码的效率,并且对语言的灵活性有所限制。JavaScript 的目标则不一样。各种因素试图分化趋向同一个平台的开发人员,这导致了语言的不一致性。从工具和开发的角度来看,这些不一致性使问题更加复杂。
浏览器并不是惟一的问题。面向对象的 JavaScript 是一种补充而不是关注的焦点。Ajax 工具箱努力使 JavaScript 朝面向对象方面转变 — 但是各自采取不同的方式。这可能会使标识对象和类结构变得很困难。这种语言有几个严重的漏洞,程序员利用它们实现一些使用其他方式难以实现的技巧,这使问题更加严重(或者更好,取决于您询问的对象)。其中一个例子是将主要的代码块封装到一个 evalf(..) 函数中,使它只在运行时有效。我们目前仍然在克服这个问题,以便在 JSDT 中精确建模。
现有的 JavaScript IDE
目前可以使用一些并不完整的 JavaScript 工具。但是很多流行的工具还不能提供真正的上下文感知内容帮助,因为它们缺少真正的 JavaScript 语言建模机制。在模型较少的 IDE 中,通过使用静态平面文件列出可用的类型,可以实现内容完成和工具功能。这些类型根据输入的部分字符动态调整,并且通常不会选择代码中定义的对象成员。内容完成对上下文不敏感,因为如果没有模型的话,可实现的功能将受到很大限制。
如果没有语言模型,则很难或者不可能将代码放入到上下文中。由于很多编程元素都依赖于代码的上下文,因此使用工具建立上下文十分重要。缺少模型和代码上下文的 IDE 同样也会缺少充分的类型解析和验证、作用域、可视性,或者其他任何对简化开发非常重要的良好验证功能。
JSDT 设计
图 1. JSDT 语言抽象栈
JSDT 对 JavaScript 语言建模并实时隐含类结构,这通过一种全新的方式来实现。首先,构建基本的语言元素。其次,推理引擎或引擎帮助填补所有类结构和语言差异。
基本语言模型
可以将推理和建模流程看作一个操作栈。模型的开始部分是 JavaScript 源代码。通过使用类似 Eclipse JDT 的引擎,将源代码转换为私有的语言模型。语言的纯模型遵守 ECMA-3 标准。
类型和类推理
对 JavaScript 语言建模后,下一步是管理类型和类推理。许多基于 JavaScript 的工具箱(例如 Dojo、Rico、Prototype)通过自己的技术使 JavaScript 面向对象编程更加方便。JSDT 使用定制的、工具箱感知的推理引擎在工具箱内部识别类和类型结构。这些类和类型随后可以添加到语言模型中。
公开模型
最后,将私有模型及其推理部分转换为公共语言模型。公共语言模型可用于源代码、重构和 as-you-type 工具。如果其中一种工具需要修改一些 JavaScript 源代码,就得先在公共模型中进行修改,并最终转换到 JavaScript 源代码。
管理变量和成员作用域
即使语言模型为描述 JavaScript 源代码和上下文提供了基础,还需要另外一个重要因素:环境上下文。JSDT 必须在运行 JavaScript 的全局作用域时建立可用的变量和类型。这些变量和类型根据 JavaScript 的运行时环境而有所不同。当 JavaScript 在 Web 浏览器上下文中运行时,对象、类型、表示屏幕数据的字段以及浏览器对象在全局作用域中都是可用的。如果代码是针对其他内容而不是浏览器,那么整个对象集可能会不同。
图 2. JSDT 库配置
JSDT 使用库机制管理项目中的通用对象、变量和类型。可以将库添加到项目中,以提供特定于用户目标运行时环境的对象和变量集。如果存在两个定义冲突成员的库,则在相应的用户接口中聚合并注释这些成员。这有助于创建在浏览器或环境之间通用的方法。
为流行的浏览器预打包库非常简单。库被捆绑在一个插件中,该插件包含有定义对象和类型的 JavaScript 源文件。当 JSDT 对源代码编辑器中打开的文件进行建模时,它首先对文件的源代码建模,然后将项目的库集合中的所有源文件添加到模型。库源文件永远不会进行验证,只用于定义对象结构、附加在悬浮式帮助和内容完成中可见的 JsDoc。
虽然库的主要功能是管理 JavaScript 的运行时上下文,但是它还提供了另一个重要特性 — 处理源文件交叉引用。纯 JavaScript 不具备显式的 include 函数。开发人员的一个不良习惯就是将函数散布到多个源文件中。库配置页面可以帮助管理源文件之间的交叉项目可见性。如果某个项目文件夹被标记为一个源文件,那么该文件夹中的所有 JavaScript 将包括在全局作用域中。使用 exclude 模式可以限制文件夹。
工具
撇开较高层的设计不谈,我们仔细看看这些特性。JSDT 的一些可视性较弱但非常重要的特性包括:相同文字突出显示、自动闭合大括号(以及圆括号、引号)以及自动缩进等。因此可以说,“只要是良好 IDE 应该具备的,JSDT 都提供支持”。
图内容帮助
图 3. 内容帮助
内容完成可以通过 Ctrl+Space 键任意调用。图 3 展示了内容帮助调用文档对象。内容完成对上下文敏感,并且基于全局作用域和 JavaScript 模型。完成条目显示字段名、字段类型和字段的声明类型。
检测和纠正错误
如果 IDE 可以主动确定代码错误,它将非常有用。JSDT 可以检测三种主要错误类型:语法/语言错误、类型/字段/方法可视性、流或逻辑错误。所有的错误警告级别都可以通过首选项页面进行单独配置。
图 4. 未解析的方法
JSDT 试图解析对象的所有字段和方法。未解析的方法则标记为错误。
图 5. 语法错误
JSDT 还可以查找并标记语法错误。下面的 for() 语句丢失了一个分号。
图 6. 流分析
图 6 演示了流分析。由于 return 语句后面的所有代码都不能执行,因此将其标记为错误。
图 7. 快速修复
一些错误具有快速修复选项。在图 7 中,当用户单击未解析变量 formyValue 旁边的错误标记时,JSDT 将显示一些纠正错误的选项。
代码格式化
源代码有时会混乱。您可能期望易于阅读、结构良好、格式化良好的代码。这就需要在进行开发和调试时对代码进行格式化。JSDT 支持许多 as-you-type 格式化特性,比如可配置自动缩进和字符成对匹配。这些特性都有助于加快开发和提高可读性。
如果您收到的代码非常混乱,该怎么办?只需要单击一下鼠标,JSDT 代码格式化程序就可以整理并重新格式化混乱的 JavaScript 代码。格式化引擎是高度可配置的,因此可以导出配置供团队共享。
其他 JSDT 特性
上面列出的仅是 JSDT 支持的特性的一部分。下面列出非常简单但必须具备的 JSDT 特性:
- 语法突出显示
- 折叠/行号
- 完整描述、显示类、函数和字段
- 突出显示并检查大括号/圆括号匹配
- 自动完成大括号、圆括号和缩进
- 标记出现位置
- 注释切换(行或块)
- 生成元素 JsDoc
- 用 do,for,try/catch,while 包围
- 用户可配置的完成模板
- 提取函数/修改函数签名
- 缩排纠正
- 打开声明
- 开放类型结构
- 开放调用结构
- 可定制的代码格式化
- 全搜索
- 重构/重命名/移动
- 断点支持
- 使用 JsDoc 为 Firefox、Internet Explorer 和 ECMA-3 定义浏览器库
- 通过 JsDoc + JavaScript 原型定义支持用户定义的库
- 库映像支持
- ATF Project 提供的调试支持
结束语
如果需要一种免费的 Web 开发环境,请选择 Eclipse。由于新增了 JSDT,Eclipse 的 JavaScript 能力超越了市场上其他同类产品。开放源码项目促成了 JSDT 的快速发展,JSDT 将像 JavaScript 一样快速地演进。
|
相关推荐
同时,SAP UI5兼容Open AJAX标准,并可以与标准的JavaScript库协同工作。其客户端渲染库提供了丰富的控件集合,允许开发者扩展现有控件或开发新的自定义控件。 #### 文档概述 文档版本为1.3(2013-01-17),主要...
Enhanced Wechat App Development Toolkit (微信小程序增强开发工具) 为什么开发这个工具? 厌倦了不停的对比 或者 的特性,间歇性的踩雷,以及 code once, run everywhere 的幻想。只想给小程序开发插上效率的翅膀 ...
### Google Web Toolkit 2 Application Development Cookbook #### 一、概览 《Google.Web.Toolkit.2.Application.Development.Cookbook》是一本专为开发者提供实践指导的书籍,它聚焦于使用Google Web Toolkit...
《Packtpub.Google.Web.Toolkit.2.Application.Development.Cookbook.Nov.2010》是一本专注于Google Web Toolkit(GWT)2.0应用程序开发的实战指南,它旨在帮助开发者充分利用GWT的强大功能,创建高效、交互性强的...
- 通过学习《Packt.Google.Web.Toolkit.2.Application.Development.Cookbook》,开发者不仅能够掌握如何使用GWT高效地开发Web应用,还能深入了解如何将GWT与其他关键技术(如JPA、MySQL和iReport)结合起来,以构建...
《Packt.Google.Web.Toolkit.2.Application.Development.Cookbook.Source.Code》这个压缩包文件主要包含的是关于使用Google Web Toolkit(GWT)进行Web应用程序开发的源代码。GWT是一款强大的开源工具,它允许开发者...
1. **JSDT** (JavaScript Development Toolkit):这是 Web Tools Platform (WTP) 自带的插件,只要安装了 WTP 就无需单独安装 JSDT。 2. **JSEclipse**:可以通过 Eclipse 的自动更新功能从指定的 URL 安装该插件。...
Spket IDE is powerful toolkit for JavaScript and XML development.... Spket IDESpket IDE is powerful toolkit for JavaScript and XML development. The powerful...
而Java的JWME(Java Wireless Toolkit)则是为移动设备和嵌入式系统开发Java应用程序的工具。 FDD(Feature Driven Development)是一种软件开发方法论,强调以功能需求驱动整个开发过程。在JavaScript开发中,FDD...
输入下载链接的文本,并按下回车,然后选择“UI Development Toolkit for HTML5”并继续安装。安装过程中,需要同意许可协议,并等待下载和安装完成。 在完成以上步骤后,为了确保环境配置正确,需要测试SAPUI5开发...
除了基本的设置,还可以考虑安装一些增强型的代码补全插件,如"JSDT"(JavaScript Development Toolkit)和"EGit",它们能提供更丰富的代码提示和版本控制功能。 最后,确保你的Eclipse和所有插件都是最新版本,...
"jsdt"则是JavaScript Development Toolkit的缩写,它是WTP项目的一部分,专门针对JavaScript开发而设计。JSDT提供了诸如代码自动完成、语法高亮、错误检查、重构工具等一系列强大的功能,帮助开发者提高编写...
1. **环境搭建**: 首先,你需要安装Java Development Kit (JDK),然后下载并配置GWT SDK。使用Eclipse或IntelliJ IDEA等集成开发环境(IDE)可以方便地创建和管理GWT项目。 2. **创建第一个GWT应用**: 通过IDE创建一...
1. **JSDT (JavaScript Development Toolkit)**:这是Eclipse的Web Tools Platform (WPT)自带的JavaScript插件,无需额外安装,只需确保Eclipse版本包含了WPT。 2. **JSEclipse**:这是一个专门针对JavaScript开发...
1. `org.eclipse.wst.jsdt.ui_1.0.201.v2010012803.jar`:这是一个Web标准工具集(Web Standard Tools - WST)中的JavaScript开发工具用户界面(JavaScript Development Toolkit - JSDT UI)组件。它提供了用于编辑...
1. **JavaScript Development Toolkit (JDT)**:虽然Eclipse默认支持JS开发,但其功能相对基础。为了提供更强大的JS开发支持,Eclipse引入了JSDT。JSDT提供了代码自动完成、语法高亮、错误检查和重构等功能,帮助...
Google Web Toolkit(简称GWT)是谷歌公司发布的一款开源框架,它允许开发者使用Java语言编写客户端的Web应用程序,并将其编译成浏览器可执行的JavaScript代码。这种方式不仅提高了开发效率,还能够确保代码在不同...