简介

　　事实证明，在现有的应用程序中添加功能是软件开发中最具挑战性的任务之一。除了不改变现有的代码外，还要确保新增的代码满足所有易用性和性能需求。在本文中，学习如何在 Web 项目的后期阶段引入新功能，以及如何无缝地把修改集成到现有项目中。

　　本文介绍的方法在软件开发生命周期的以下阶段中尤其有意义：
　　开发阶段。客户要求开发团队在产品中集成新功能，从而提高易用性（由于项目采用迭代式的敏捷开发方法，这种情况越来越常见了。）这要求在短时间内对新功能进行快速分析和集成，而且不能破坏应用程序的健壮性和标准。

　　维护阶段。常常需要添加和删除功能。开发团队还可能需要为特定的客户接入或取消某些功能。还常常需要进行其他的定制工作。

　　分析了这个问题之后，团队应该开发一个灵活的体系结构，从而支持无缝地添加和删除功能，而不需要修改产品或应用程序核心功能的代码。在理想情况下，应该根本不修改属于核心功能的代码，因为在这部分代码的测试和稳定性处理方面已经投入了大量时间。本文中的用例演示如何开发这样的应用程序，并指出一些挑战。

用例

　　一个博客应用程序已经开发完并投入使用了。但是，客户又提出了一项新要求：在博客系统中增加邮件功能。客户已经有一个邮件服务器，希望以某种方式把这两个应用程序集成起来。客户希望：
　　每当用户单击有效的 URL 时，都给他们提供一个窗口。
　　这个窗口包含邮件组件提供的所有选项。
　　邮件窗口可以向邮件服务器发送邮件。

挑战

　　开发团队不愿意为了添加邮件功能而修改博客系统的核心功能，因为这样做的风险太大了。如果开发团队在开发核心功能时使用了第三方软件，而这些软件不允许他们修改源代码，那么情况就更加麻烦了。另外，管理人员也反对修改现有的表示层和业务层。

解决方案

　　开发团队可以选用两种方法。图 1 展示了核心功能和新功能并不紧密集成的方法；体系结构使新功能与核心功能松散地耦合：
　　图 1. 核心功能和新功能并不紧密集成

 附件: 您所在的用户组无法下载或查看附件

    图 2 展示了核心功能和新功能紧密集成的方法；在这个体系结构中，新功能成为核心功能的固有部分。

　　图 2. 核心功能和新功能紧密集成

 附件: 您所在的用户组无法下载或查看附件

    开发团队决定采用第一种方法（图 1）。这种方法具备与松散耦合体系结构相关的所有优点，比如代码可重用性，而且限制了测试所需的工作量。

　　他们将使用 Dojo 开发组件并以松散耦合方式把它们集成到主应用程序中。他们选择 Dojo 是因为：

　　Dojo 是基于 JavaScript 的工具包，能够满足对集成简便性的需求。只需包含 JavaScript，开发人员就可以享受到一个强大 API 带来的好处，这个 API 对于大多数开发任务应该足够了。它使团队能够开发出功能丰富、外观漂亮的组件，而且很容易把这些组件集成到应用程序中。

　　Dojo 支持 Ajax，这意味着应用程序的响应性更好，总体效率更高。更重要的是，可以与主应用程序非常快速地交互。

　　Ajax 是一种用来创建交互式 Web 应用程序的 Web 开发技术。它在幕后与服务器交换少量数据，这样就不必在用户每次发出请求时都重新装载整个 Web 页面，从而使 Web 页面显得响应性更好。这种技术会增加 Web 页面的交互性、速度、功能和易用性。关于 Ajax 的更多信息参见 参考资料。

感谢原创者的辛勤劳动，希望对您有所帮助，转载请注明原出处。

您可能对 [Dojo] 的这些文章也感兴趣： 学习Ajax框架之dojo：第二节---Dojo的基本函数及使用实例 学习Ajax框架之dojo：第一节---ATF配置和Dojo实例资源 学习Ajax框架之dojo：第十二节——Dojo的General Widget（下）（附源代码） dojo是什么 学习Ajax框架之dojo：第七节——初识Dojo widget（附源代码） 学习Ajax框架之dojo：第五节——dojo拖拽事件小结（附源代码） 学习Ajax框架之dojo：第八节——Dojo的Layout Widget（附源代码） 学习Ajax框架之dojo：第十一节——Dojo 的General Widget（上）（附源代码） 学习Ajax框架之dojo：第九节——详谈FloatingPane widget （附源代码） 学习Ajax框架之dojo：第十节——Dojo的 Form Widget （附源代码）

添加 Dojo 组件

　　首先，需要设置 Dojo（设置方法参见 参考资料）。在设置 Dojo 之后：

　　需要创建一个 .js 文件，这个文件将包含后面编写的大多数代码。在插入所需的功能时，只需把这个 .js 包含在表示层（jsp、HTML 等等）中。

　　为了避免在表示层中包含 Dojo 库，应该在步骤 1 中创建的 .js 文件中包含它们。清单 1 给出的示例代码启用了 dojo.js 的包含：

　　清单 1. 启用 dojo.js 的包含



根据目录结构的不同，可能需要像清单 2 这样调用清单 1：

　　清单 2. 调用清单 1 中的功能



通过一个解析机制，可以找到用户在屏幕上输入的任何电子邮件地址。可以使用 JavaScript 的正则表达式完成这个任务，如清单 3 所示：

　　清单 3. 搜索所有有效的电子邮件模式



编写一个代码片段，把电子邮件地址包围在一个标签标记中，如清单 4 所示：

　　清单 4. 替换所有有效的电子邮件模式



使用 sendmail 函数包含用来创建和显示 Dojo 组件的主业务逻辑和代码。根据使用的组件和 API，包含组件所需的文件。清单 5 给出一个示例：

　　清单 5. 包含必需的包



即使只需包含特定的组件库（比如 dojo.widget.Button），也必须包含 dojo.widget.* 等包。这种方式与 Java 和其他语言不一样。dojo.require 方法将动态地获取 JavaScript 代码并把它们装载到页面中。如果没有包含 dojo.widget.* 和 dojo.widget.Button，就会遇到一个运行时异常，因为还没有装载通用的组件库。

　　Dojo 提供两种创建组件的方法：

　　在构造函数中传递组件的父 id（见清单 6）。这里的 “父” 是指组件将连接的 DOM 元素。

　　清单 6. 创建 Dojo 组件



以程序方式创建组件并把它们插入 DOM 结构，见清单 7：

清单 7. 创建 Dojo 组件



清单 7 在布局容器中添加编辑器。为了连接邮件组件，可以包含以下代码：



为了添加业务逻辑（用来发送电子邮件的实际代码），Dojo 允许把定制的方法与工具包提供的基本方法连接在一起。连接定制方法所用的代码如下：



编写处理 onclick 事件的函数，见清单 8：

　　清单 8. 处理事件的示例代码



最后，显示组件：



为了异步地提交数据，需要使用 dojo.io 库。这个库提供一个相当简单的接口，可以通过 bind 方法异步地提交表单数据。清单 9 给出一个示例：

　　清单 9. 处理事件



Dojo 支持跨域通信。因为这个应用程序需要跨不同的域（应用服务器，邮件服务器）进行通信，所以需要使用 Dojo 的 XhrIframeProxy 库。在前面编写的 .js 文件中添加清单 10 中的代码。

　　在 Dojo 的 bind 函数中包含 dojo.io.XhrIframeProxy，这个库完成所有 Iframe 工作：
dojo.require("dojo.io.XhrIframeProxy");

　　清单 10. Dojo 的绑定调用



IframeProxyUrl 是外部域上 HTML 文件的位置，这个域包含一个实现授权（isAllowedRequest）功能的 .js 文件。

　　externalDomain 域上的 HTML 文件 myhtml.html 应该包含 .js 文件或者直接在脚本标记中实现清单 11 中的函数：

　　清单 11. 远程 HTML 应该包含的函数



结束语

　　在本文中，学习了如何添加一个浮动面板（Dojo 组件），并在不修改原来的代码的情况下把它集成到主应用程序中。这种开发战略的优点包括：

　　不同的团队可以分别开发项目的各个独立部分，这样就可以同时开发不同的模块。这种开发方式支持开发和集成独立且可重新发布的代码。


　　显著降低测试和接受代码所需的工作量。测试人员只需关注要集成的新功能，而不需要重新测试整个应用程序。

　　可以根据业务需求进行灵活的定制。可以在任何时候添加或删除功能。

参考资料

学习

• 您可以参阅本文在 developerWorks 全球站点上的 英文原文 。
  
  
• 观看演示程序并了解关于 Dojo 的所有信息。
  
  
• 查阅 Dojo 的 FAQs。
  
  
• “使用 Dojo 开发 HTML 小部件”（Igor Kusakov，developerWorks，2007 年 2 月）解释了用 Dojo 开发 HTML 组件的基本知识，包括如何引用图像、如何在 HTML 页面中添加事件处理函数以及如何处理复合组件。
  
  
• 通过案例研究 “使用 Dojo 和 DB2 开发 Ajax Web 应用程序”（Leons Petrazickis，developerWorks，2007 年 2 月），学习如何用 IBM DB2 9 for Linux, UNIX, and Windows、XQuery、PHP 和 Dojo JavaScript Framework 快速创建优雅的响应性 Web 应用程序。
  
  
• “使用 Ajax 构建应用程序”（Naveen Balani 和 Rajeev Hathi，developerWorks，2005 年 11 月）通过构造一个图书订购应用程序，解释了如何构建基于 Ajax 的 Web 应用程序（包括实时检验，并避免页面刷新）。
  
  
• 在 技术书店 浏览关于这些主题和其他技术主题的图书。
  
  

获得产品和技术

• 下载 IBM 产品评估版，试用这些来自 DB2®、Lotus®、Rational®、Tivoli® 和 WebSphere® 的应用程序开发工具和中间件产品。

讨论

• 参与 developerWorks blog 并加入 developerWorks 社区。