js设计模式--发布订阅者模式

概述

发布订阅者模式用于处理对象之间的事件通信,该模式涉及两个主要角色:发布者(Publisher)和订阅者(Subscriber)

发布者维护一个事件列表,并在事件发生时通知所有已注册的订阅者。订阅者可以选择接收或忽略通知。

使用场景

发布-订阅者模式通常用于解耦应用程序中的组件,使得它们可以独立地交互。以下是一些使用发布-订阅者模式的场景:

  1. 事件处理:当事件发生时,将其发布到一个或多个订阅者,以便它们可以执行相关操作。
  2. GUI编程:当用户与GUI界面交互时,会触发各种事件。这些事件可以作为发布者,GUI控件可以作为订阅者。
  3. 消息系统:在分布式系统中,消息队列可以将消息发布给多个订阅者,以实现可靠的消息传递。
  4. 日志记录:日志记录框架可以使用发布-订阅者模式,将日志消息发布给多个订阅者,如文件、数据库或网络服务。
  5. MVC模式:MVC(Model-View-Controller)模式利用发布-订阅者模式来实现模型和视图之间的松耦合关系,使得它们可以独立地交互。

代码示例

class EventBus {
  constructor() {
    this.listeners = {};
  }

  on(event, listener) {
    if (!this.listeners[event]) {
      this.listeners[event] = [];
    }
    this.listeners[event].push(listener);
  }

  emit(event, ...args) {
    const listeners = this.listeners[event];
    if (listeners) {
      listeners.forEach((listener) => {
        listener(...args);
      });
    }
  }

  removeListener(event, listenerToRemove) {
    const listeners = this.listeners[event];
    if (listeners) {
      this.listeners[event] = listeners.filter(
        (listener) => listener !== listenerToRemove
      );
    }
  }

  removeAllListeners(event) {
    delete this.listeners[event];
  }
}

这个 EventBus 类有 onemitoffclear 方法。

  • on(event, listener) 方法用于向指定事件添加一个监听器。
  • emit(event, ...args) 方法用于触发指定事件,会执行所有与该事件相关的监听器函数,并将提供的参数传递给它们。
  • removeListener(event, listenerToRemove) 方法用于从指定事件中删除特定的监听器函数。
  • removeAllListeners(event) 方法用于删除指定事件上的所有监听器函数。

你可以像这样使用它:

const bus = new EventBus();

const listenerFunction = (args) => {
  console.log(args);
};

// 1. 添加一个监听器
bus.on('click', listenerFunction);
// 2. 触发事件
bus.emit('click', 'Hello');
// 3. 删除监听器
bus.removeListener('click', listenerFunction);
// 4. 删除所有监听器
bus.removeAllListeners('click');

观察者模式 vs 发布订阅者模式

观察者模式和发布订阅者模式都是用来实现组件间通信的设计模式,但有以下区别:

  1. 耦合度不同:观察者模式中,观察者和被观察者是紧密耦合的,即观察者需要直接访问被观察者;而发布订阅者模式中,发布者和订阅者之间是松散耦合的,它们通过一个中介者(也称为消息队列、事件总线等)进行通信。这意味着,发布订阅者模式更加灵活,可以支持多个发布者和多个订阅者。
  2. 通信机制不同:观察者模式中,被观察者会向所有注册的观察者发送通知,观察者需要自己判断是否处理该通知;而发布订阅者模式中,发布者只需要将消息发送给中介者,由中介者负责将消息传递给所有订阅者。
  3. 角色定义不同:在观察者模式中,Observer(观察者)和 Subject(被观察者)是两个核心角色;而在发布订阅者模式中,Publisher(发布者)和 Subscriber(订阅者)是核心角色,还有一个 Event Bus(事件总线)或 Message Queue(消息队列)作为中介者。

相关推荐

  1. js设计模式--发布订阅模式

    2024-05-13 20:26:08       40 阅读
  2. 发布订阅模式和观察模式详解

    2024-05-13 20:26:08       56 阅读
  3. 观察模式发布-订阅模式有什么异同

    2024-05-13 20:26:08       38 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-05-13 20:26:08       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-05-13 20:26:08       100 阅读
  3. 在Django里面运行非项目文件

    2024-05-13 20:26:08       82 阅读
  4. Python语言-面向对象

    2024-05-13 20:26:08       91 阅读

热门阅读

  1. Goframe学习笔记(六)上下文共享变量

    2024-05-13 20:26:08       49 阅读
  2. 1900年-2100年公历转农历数据

    2024-05-13 20:26:08       31 阅读
  3. KUKA机器人专业名词解释

    2024-05-13 20:26:08       36 阅读
  4. 大型ERP设计-业务与功能指引:供应商寄售业务

    2024-05-13 20:26:08       39 阅读
  5. docker-compose使用

    2024-05-13 20:26:08       38 阅读
  6. Pytorch中的self.parameters()

    2024-05-13 20:26:08       35 阅读
  7. leetCode33. 搜索旋转排序数组

    2024-05-13 20:26:08       37 阅读