JavaScript 组合模式

 

如果您在通读单例模式一节后，认为“嗨，这很简单”，那么不要着急，我还有一些更加复杂的模式要讨论，其中一个就是组合模式。 组合，顾名思义是指用包含多个部件的对象创建单一实体。 这个单一实体将用作所有这些部件的访问点，虽然这大大简化了操作，但也可能具有相当的欺骗性，因为没有哪种隐性方式明确表明该组合包含多少部件。

组合结构

我们最好使用例证解说组合。 在图 1 中，您可以看到两种不同类型的对象： 容器和库是组合，图像是叶片。 组合可承载子项，但一般不会实施更多行为。 叶片包含绝大多数行为，但不能承载子项，至少在传统的组合示例中不可以。

图 1. 组合结构

另一个示例，我本人百分百确定您之前见到过组合模式，但从未真正进行深入思考。 计算机文件结构是组合模式的一个实例。 如果您删除某个文件夹，也将删除该文件夹的所有内容，是吗？ 这实质上就是组合模式运行原理。 您可以调用结构树上较高层次的组合对象，消息将沿这一层次结构向下传输。

组合编码示例

此示例创建图片库，将其作为组合模式示例。 只有三个层次： 专辑、库和图像。 专辑和库将作为组合，图像是叶片，如图 1 所示。这是一种比组合本身需求更加明确的结构，但对于本示例而言，将这些层次仅限制为组合或叶片很有意义。 标准组合不会限制哪些结构层次可以具有叶片，也不会限制叶片数量。

要开始操作，应首先创建用于专辑和库的 GalleryComposite“类”。 请注意，我正在使用 jQuery 执行 DOM 操作以简化过程。