Javascript设计模式 - 《组合模式（结构型）》

概念

组合模式（Composite Pattern）是一种结构型设计模式，它允许将对象组合成树形结构以表示部分-整体的层次结构

组合模式使得客户端可以统一地处理单个对象和对象集合

组合模式通常涉及两个核心角色：组件（Component）和叶子节点（Leaf）

组件（Component）

定义了组合中所有对象共有的接口和行为，并提供了管理子组件的方法

组件可以是抽象类或接口，它可以是叶子节点或容器节点
叶子节点（Leaf）

表示组合中的叶子对象，它没有子组件

叶子节点通常是组合的最小单元，它实现了组件接口的具体行为

组合模式的核心思想是将对象组合成树形结构，并且统一对待单个对象和对象集合

这种模式的优点在于，可以简化客户端和对象之间的交互，客户端不需要区分单个对象和对象集合，而是统一地对待它们

同时，组合模式也提供了一种灵活的方式来组织和管理对象的层次结构

组合模式适用于以下情况：

当希望将对象组合成树形结构，并且统一对待单个对象和对象集合时，可以使用组合模式
当希望客户端可以统一地处理单个对象和对象集合时，组合模式也是一个很好的选择

举个简单的例子，考虑一个文件系统中的目录和文件对象

目录可以包含其他目录和文件对象，而文件是组合中的叶子节点

组合模式可以将目录和文件抽象成组件对象，并将它们组合成树形结构

这样，可以通过统一的方式来处理目录和文件对象，而不需要区分它们的类型

实现条件

对象具有层次结构

组合模式适用于对象具有层次结构的情况，对象可以按照树形结构组织，并且对象之间存在整体-部分关系
客户端统一处理叶子对象和容器对象

组合模式适用于客户端需要统一处理叶子对象和容器对象的情况，客户端无需区分对象是叶子对象还是容器对象，可以统一对待
对整体和部分具有一致性要求

组合模式适用于对整体和部分具有一致性要求的情况，客户端可以通过统一的接口对整体对象和部分对象进行操作，无需关心具体是哪种对象
需要简化客户端代码

组合模式适用于需要简化客户端代码的情况，客户端无需关心对象的层次结构和具体实现细节，只需要使用统一的接口来操作对象

优点

统一接口

组合模式统一了叶子对象和容器对象的接口，使得客户端可以统一对待叶子对象和容器对象，无需区分
灵活性

组合模式使得客户端可以像处理单个对象一样处理对象的组合，从而增加了系统的灵活性
可扩展性

组合模式通过递归结构实现了对象的树形结构，可以方便地扩展和修改树形结构，从而提高了系统的可扩展性
简化客户端代码

组合模式使得客户端无需关心对象的层次结构和具体实现细节，只需要使用统一的接口来操作对象，从而简化了客户端代码
增加了安全性

组合模式可以通过类型检查来保证容器对象只能包含叶子对象或者其他容器对象，从而增加了系统的安全性

缺点

限制子对象的类型

组合模式将叶子对象和容器对象统一成了一种类型，可能会限制子对象的类型，使得子对象的类型不能发生变化
增加了系统复杂度

组合模式通过递归结构实现了对象的树形结构，可能会增加系统的复杂度，特别是在处理复杂的树形结构时
不适用于需求变化频繁的场景

如果对象的结构和层次经常发生变化，可能会导致组合模式的实现变得复杂和不稳定，不适用于需求变化频繁的场景

实现方式

基础类

/**
 * 表示文件系统的一个组件，是一个抽象基类，不能直接实例化。
 */
class FileSystemComponent {
    /**
     * 构造函数，创建一个文件系统组件实例。
     * @param {string} name 组件的名称。
     * @throws {Error} 当尝试直接实例化FileSystemComponent时抛出错误。
     */
    constructor(name) {
        if (new.target === FileSystemComponent) {
            throw new Error('FileSystemComponent is an abstract class and cannot be instantiated directly.')
        }
        this.name = name
    }
    
    /**
     * 执行文件系统组件的操作，此方法在子类中被重写。
     * @param {number} indent 缩进级别，用于格式化输出。
     * @throws {Error} 当调用此方法时抛出错误，因为这是一个抽象方法。
     */
    operation(indent = 0) {
        throw new Error('This method should be overridden')
    }
}

子类

/**
 * 表示一个目录，继承自FileSystemComponent。
 */
export class Directory extends FileSystemComponent {
    /**
     * 构造函数，创建一个目录实例。
     * @param {string} name 目录的名称。
     */
    constructor(name) {
        super(name)
        this.children = [] // 存储子组件的数组
    }
    
    /**
     * 向目录中添加一个组件。
     * @param {FileSystemComponent} component 要添加的文件系统组件。
     * @throws {Error} 当添加的对象不是FileSystemComponent的实例时抛出错误。
     */
    add(component) {
        if (!(component instanceof FileSystemComponent)) {
            throw new Error('Component must be an instance of FileSystemComponent')
        }
        this.children.push(component)
    }
    
    /**
     * 从目录中移除一个组件。
     * @param {FileSystemComponent} component 要移除的文件系统组件。
     * @returns {boolean} 成功移除返回true，否则返回false。
     */
    remove(component) {
        const index = this.children.indexOf(component)
        if (index !== -1) {
            this.children.splice(index, 1)
            return true
        }
        return false
    }
    
    /**
     * 执行目录的操作，包括打印目录名称和所有子组件的信息。
     * @param {number} indent 缩进级别，用于格式化输出。
     */
    operation(indent = 0) {
        console.log(`${' '.repeat(indent)}Directory: ${this.name}`)
        this.children.forEach(child => child.operation(indent + 2))
    }
}

/**
 * 表示一个文件，继承自FileSystemComponent。
 */
export class File extends FileSystemComponent {
    /**
     * 执行文件的操作，即打印文件的名称。
     * @param {number} indent 缩进级别，用于格式化输出。
     */
    operation(indent = 0) {
        console.log(`${' '.repeat(indent)}File: ${this.name}`)
    }
}

怎么使用

/**
 * 这段代码展示了使用组合模式来管理文件系统对象的例子。
 * 首先，导入了组合模式中的 Directory 和 File 类。
 * 然后，创建了一个根目录 root，两个子目录 dir1 和 dir2，以及两个文件 file1 和 file2。
 * 接着，将 dir1 和 file1 添加到 root 目录中，将 file2 添加到 dir1 目录中。
 * 最后，对 root 目录执行 operation 操作。
 */

import { Directory, File } from '../CombinationPattern'

// 创建根目录和一系列子目录及文件
const root = new Directory('root')
const dir1 = new Directory('dir1')
const dir2 = new Directory('dir2')
const file1 = new File('file1')
const file2 = new File('file2')

// 将子目录和文件添加到根目录中
root.add(dir1)
root.add(file1)
root.add(dir2)
// 将文件添加到子目录中
dir1.add(file2)

// 对根目录执行操作（如打印文件结构等）
root.operation()