JavaScript组件开发:分析和设计组件

打小就看国安

打小就看国安

2016-02-20 00:59

生活已是百般艰难,为何不努力一点。下面图老师就给大家分享JavaScript组件开发:分析和设计组件,希望可以让热爱学习的朋友们体会到设计的小小的乐趣。

毫无疑问,JavaScript 是一种非常灵活的脚本语言,有时候它像一只难以驯服的野马你受益于它的灵活性的同时,也要时刻提防它变得失去控制;另一方面,由于 JavaScript 通常会和宿主环境(比如浏览器)紧密结合,因此缺乏功能强大而简单易用的开发工具。在这样的环境中,开发组件或框架成为一项具有挑战的工作。
这次,我们将以一个简易的 JavaScript 组件开发为契机,逐步展开组件的分析、设计、实现、构建和测试等任务,探讨组件开发过程涉及的方方面面。这些探讨将分 4 篇陆续张贴出来(链接将在张贴后更新):

分析和设计组件 编码实现和算法 用 Ant 构建组件 测试 JavaScript 组件

现在,假设我们要从头开始设计并实现一个队列管理组件,先让我们来认识一下队列:

Queue

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

图片来自 Wikipedia.

队列是一个先进先出(FIFO) 的数据结构,只能向它的尾巴追加项,项从头部取出使用,这个规则将应用到我们所探讨的组件中去。对于队列,相信学过 C 或是数据结构课程的同学已有所了解,如果你已经把它还给了老师,请使用搜索引擎简单了解一下队列的知识。

这个队列管理组件具体要实现的功能是:它是个任务管理器,按高、中、低优先级维护着三个任务队列,客户(使用者)可以在任何时候把想要执行的任务添加到某个队列,可以指定任务运行的上下文,并传给它必要的数据。客户也可以随时运行这个队列,队列里的任务按照指定的依赖关系以合理的方式依次运行。

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

为了不至于使组件过于简单而缺乏实用性,我们特意给它添加了一些糖:分优先级、传入上下文和数据、处理依赖关系。如果把上面这段理解为需求的话,那么首先,我们要从中提取出最重要的关键词,它们直接决定了这个组件应该如何设计:

队列 优先级 依赖关系

然后,我们从中提炼出涉及的对象:

任务管理器 (TaskManager): 从目前需求来看,它只需要一个实例。 队列 (Queue): 每个优先级对应一个队列,由 TaskManager 管理这三个 Queue 实例。 任务 (Task): 描述添加的任务,放在相应优先级的 Queue 里面。 依赖 (Dependency): 描述单一的依赖,即 Task1 依赖 Task2, 显然某个 Task 可能具有多个依赖。

展开更多 50%)
分享

猜你喜欢

JavaScript组件开发:分析和设计组件

Web开发
JavaScript组件开发:分析和设计组件

组件对象开发Web应用的实例分析

ASP
组件对象开发Web应用的实例分析

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

Flash技巧:FLA组件开发之文本条组件

FLASH flash教程 autocad教程
Flash技巧:FLA组件开发之文本条组件

用Ant构建JavaScript组件

Web开发
用Ant构建JavaScript组件

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

在.NET中开发组件

电脑网络
在.NET中开发组件

JavaScript组件打包css image

Web开发
JavaScript组件打包css image

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Javascript不可缺少的工具 - Aptana

Javascript不可缺少的工具 - Aptana

Javascript 代码也可以变得优美

Javascript 代码也可以变得优美
下拉加载更多内容 ↓