发布/订阅模式：JavaScript 中的事件侦听利器

2023-11-29 06:12:33

在 JavaScript 的世界里，发布/订阅模式（又称观察者模式）是一种强大的事件处理机制，它定义了一种一对多的关系，其中多个观察者对象监听一个主题对象。当主题对象发生改变时，所有依赖的观察者对象都会收到通知。

这种模式的妙用体现在它实现了松散耦合：观察者对象无需了解主题对象的内部工作原理，只需注册事件侦听器即可。这使得系统更加灵活且易于维护。

了解发布/订阅模式

发布/订阅模式遵循一个简单的原则：当主题对象发生改变时，它会发布一个事件，所有已注册的观察者对象都会收到这个事件的通知并执行预先定义的回调函数。

在 JavaScript 中实现

在 JavaScript 中，我们可以使用 addEventListener 方法将事件侦听器注册到主题对象上。当事件触发时，相应的回调函数就会被执行。

// 主题对象
const topic = {
  subscribers: [],

  // 订阅事件
  subscribe(callback) {
    this.subscribers.push(callback);
  },

  // 发布事件
  publish() {
    this.subscribers.forEach((subscriber) => subscriber());
  }
};

// 观察者对象
const observer1 = () => {
  console.log("观察者 1 收到通知");
};

const observer2 = () => {
  console.log("观察者 2 收到通知");
};

// 订阅主题对象
topic.subscribe(observer1);
topic.subscribe(observer2);

// 发布事件
topic.publish();