一天一个设计模式---组合模式

基本概念

组合模式是一种结构型设计模式,它允许客户端统一对待单个对象和对象的组合。组合模式通过将对象组织成树形结构,使得客户端可以一致地使用单个对象和组合对象。

主要角色:

  1. Component(组件): 定义组合中的对象接口,可以是抽象类或接口,声明了用于管理子组件的方法。
  2. Leaf(叶子): 表示组合中的叶子节点对象,实现了Component接口。叶子节点没有子节点。
  3. Composite(复合): 表示组合中的具有子节点的复合对象,实现了Component接口。复合对象可以包含叶子节点和其他复合对象,形成递归结构。

优点

  • 统一接口: 客户端通过统一的接口处理单个对象和组合对象,不需要区分它们的具体类型。
  • 灵活性: 客户端可以以相同的方式处理单个对象和组合对象,从而使得系统更加灵活。
  • 可扩展性: 可以方便地添加新的组件,无需修改客户端代码。

结构

示例代码

Component 定义了组件的接口,Leaf 表示叶子节点,Composite 表示复合节点。客户端可以通过统一的 operation 方法处理单个对象和组合对象。

JS 复制代码
// Component
class Component {
  constructor(name) {
    this.name = name;
  }

  operation() {
    throw new Error('Operation not supported');
  }
}

// Leaf
class Leaf extends Component {
  operation() {
    console.log(`Leaf ${this.name} operation`);
  }
}

// Composite
class Composite extends Component {
  constructor(name) {
    super(name);
    this.children = [];
  }

  add(child) {
    this.children.push(child);
  }

  remove(child) {
    const index = this.children.indexOf(child);
    if (index !== -1) {
      this.children.splice(index, 1);
    }
  }

  operation() {
    console.log(`Composite ${this.name} operation`);
    this.children.forEach(child => child.operation());
  }
}

// Usage
const leaf1 = new Leaf('1');
const leaf2 = new Leaf('2');

const composite = new Composite('Composite');
composite.add(leaf1);
composite.add(leaf2);

const leaf3 = new Leaf('3');
const leaf4 = new Leaf('4');

const subComposite = new Composite('SubComposite');
subComposite.add(leaf3);
subComposite.add(leaf4);

composite.add(subComposite);

composite.operation();
相关推荐
半夏知半秋2 小时前
游戏登录方案中常见的设计模式整理
服务器·开发语言·笔记·学习·游戏·设计模式·lua
Asort6 小时前
JavaScript设计模式(十八)——备忘录模式:状态保存与恢复的艺术
前端·javascript·设计模式
原来是好奇心6 小时前
告别if-else!使用策略模式优雅处理多种MQTT消息类型
java·mqtt·设计模式·策略模式·emqx
AY呀7 小时前
# 从 HTML5 敲击乐到前端工程化:模块化开发如何重塑交互体验
设计模式
天南星7 小时前
23种设计模式-深度讲解-7. 装饰器模式 (Decorator)
后端·设计模式
hans汉斯8 小时前
【计算机科学与应用】基于多光谱成像与边缘计算的物流安全风险预警模式及系统实现
大数据·数据库·人工智能·设计模式·机器人·边缘计算·论文笔记
杯莫停丶8 小时前
设计模式之:适配器模式
设计模式·适配器模式
xiezhr9 小时前
见过哪些醍醐灌顶的Java代码:从"卧槽"到"原来如此"的顿悟
java·后端·设计模式
WaWaJie_Ngen9 小时前
【设计模式】适配器模式(Adapter)
设计模式·适配器模式
Mr_WangAndy20 小时前
C++设计模式_行为型模式_策略模式Strategy
c++·设计模式·策略模式·依赖倒置原则