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

最新推荐文章于 2024-05-13 09:15:58 发布

node_bin

最新推荐文章于 2024-05-13 09:15:58 发布

阅读量1.5k

点赞数

分类专栏：观察者模式发布订阅模式 js 文章标签： javascript 观察者模式开发语言

本文链接：https://blog.csdn.net/weixin_41848005/article/details/122703480

版权

本文深入探讨了JavaScript中的观察者模式和发布/订阅模式。首先解释了观察者模式的概念，即一个对象如何维护其依赖项并自动通知它们状态变化。接着讲解了发布/订阅模式，该模式通过事件主题让订阅者接收来自发布者的事件通知。最后，文章通过实例展示了这两种模式在实际开发中的应用。

摘要由CSDN通过智能技术生成

一、观察者模式的理解

观察者模式：一个对象（称为subject）维持一系列依赖于它的对象（称为observer），将有关状态的任何变更自动通知给它们（观察者）。

二、发布/订阅模式的理解

发布/订阅模式：基于一个主题/事件通道，希望接收通知的对象（称为subscriber）通过自定义事件订阅主题，被激活事件的对象（称为publisher）通过发布主题事件的方式被通知。

上代码

1、观察者模式的应用

class Observer {
  constructor(name){
    this.name = name;
  }
  update({ type, info }){
    if(!type) {
      return;
    }
    switch (type) {
       case 'add':
       this.addEvent();
      break;
       case 'minus':
       this.minusEvent();
       
    }
  }
  addEvent() {
    console.log(`${this.name}add event`)
  }
  minusEvent() {
    console.log(`${this.name}minus event`)
  }
}

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

  addObserver(observer){
    this.subscribeList.push(observer)
  }

  notify(task){
    this.subscrib