js 观察者模式和发布订阅模式

前言

        观察者模式和发布-订阅模式都属于行为设计模式，用于实现对象之间的解耦，使得它们能够更灵活地交互。虽然它们有些相似，但也存在一些细微的区别。

正文

1.观察者模式（Observer Pattern）：

        定义： 观察者模式定义了一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都得到通知并被自动更新。

        核心角色：

Subject（主题）： 被观察的对象，当其状态发生改变时通知观察者。
Observer（观察者）： 订阅主题的对象，当主题状态改变时会得到通知。
示例代码：

class Subject {
  constructor() {
    this.observers = [];
  }

  addObserver(observer) {
    this.observers.push(observer);
  }

  notifyObservers() {
    this.observers.forEach(observer => observer.update());
  }
}

class Observer {
  update() {
    console.log('State updated!');
  }
}

const subject = new Subject();
const observerA = new Observer();
const observerB = new Observer();

subject.addObserver(observerA);
subject.addObserver(observerB);

subject.notifyObservers(); // 输出 "State updated!" 两次

2.发布-订阅模式（Publish-Subscribe Pattern）：

        定义： 发布-订阅模式定义了一种对象间的一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都会得到通知。

        核心角色：

        发布者（Publisher）： 负责发布消息的对象。
        订阅者（Subscriber）： 订阅并接收发布者发出的消息。
        示例代码：

class PubSub {
  constructor() {
    this.subscribers = [];
  }

  subscribe(subscriber) {
    this.subscribers.push(subscriber);
  }

  publish(message) {
    this.subscribers.forEach(subscriber => subscriber.notify(message));
  }
}

class Subscriber {
  notify(message) {
    console.log(`Received message: ${message}`);
  }
}

const pubSub = new PubSub();
const subscriberA = new Subscriber();
const subscriberB = new Subscriber();

pubSub.subscribe(subscriberA);
pubSub.subscribe(subscriberB);

pubSub.publish('Hello, subscribers!'); // 输出 "Received message: Hello, subscribers!" 两次

区别总结：

        通知机制： 在观察者模式中，主题直接通知观察者；而在发布-订阅模式中，发布者与订阅者之间通过消息中介来通信。

        关系建立： 观察者模式中，观察者直接订阅主题；而在发布-订阅模式中，发布者和订阅者之间通过一个中介对象（如发布-订阅模式中的PubSub）来建立关系。

        无论是观察者模式还是发布-订阅模式，都是为了实现对象之间的解耦，提高系统的灵活性和可维护性。选择使用哪种模式取决于项目的需求和设计考虑。