它的对象模型可以大概表示如下：

设计初期的对象图

注意到 Dependency 实际上并没有做什么事，而 Queue 的两个方法可以分别交给 TaskManager & Task 来负责。一个方法到底由哪个对象负责，是很容易引起争论的话题，不在我们的讨论范围内。这次，我们的重点是，采用 JavaScript 实现这个组件，结合 JavaScript 独特的语言特性，我们设想实现上述四个对象：

• TaskManager 直接通过对象 (Object) 实现。在 JavaScript 的世界，对象可以作为天然的静态类来使用——你可以直接在“类” ClassObject 里面定义属性方法 property，并以静态类的方式来引用 CassObject.property.
• Queue 以数组 (Array) 的形式体现出来，Task 则是数组中存放的每一项。对 Queue 进行操作必然要在其 prototype 中定义一些实例方法，由于每个 Queue 实例都是原生的数组，为了减少对 Array.prototype 的侵入，我们可以考虑将这些方法定义到 Task.prototype 上——将职责转移到任务上。
  将三个 Queue 数组集结在一起，形成一个“大数组”以表示三个不同优先级的队列，这个大数组可以作为 TaskManager 的属性。
• 任务的核心是一个 function, 本来可以直接用 function 来表示一个任务，但考虑到它具有自身独特的属性（优先级、依赖等等），而且是最经常被操作的对象，以后可能还会进行扩展，所以我们决定单独将其定义成对象。
• 依赖直接以数组的形式作为 Task 的一个属性存在——Task 将依赖的其他多个 Task 标识符放在这个数组中，不再单独定义这个对象。

分析下来，局势逐渐明朗——我们需要将四个对象简化成两个：TaskManager & Task, 另外两个对象用原生的数组来实现：

简化后的对象模型

又注意到这里多次以数组来实现，而编码过程中必然涉及到数组的遍历、查找等操作，JavaScript 1.6 已经为我们实现了这些数组操作。为了充分利用数组内置的原生方法，又能在较老的浏览器中运行，我们使用了 Eric 的代码。这样，我们可以直接使用诸如 forEach/indexOf 等方法，更关注组件的功能实现，而且在现代浏览器中获得较好的性能。

~~~~~~~~~~~~~ 八卦分割线 ~~~~~~~~~~~~~

嗯，在严肃地分析了组件设计之后，就要踏上快乐的编码实现之旅了。别急，TaskManager 似乎俗气了一点：不足以表达具有优先级、依赖管理的任务队列，而且用它做命名空间有跟其他代码冲突的可能性。好吧，这个组件就叫 Smart Queue 吧，响亮而又独特.^^

分析设计好了，名字也有了，欲知具体实现过程，且听下回分解。

原文：http://ued.alipay.com/?p=1118

本文链接：http://www.blueidea.com/tech/web/2009/7023.asp　

出处：Alipay UED
责任编辑：bluehearts

上一页 JavaScript组件之旅:分析和设计 [1] 下一页

◎进入论坛网页制作、WEB标准化版块参加讨论，我还想发表评论。