【设计模式】观察者模式和订阅发布模式

news2024/12/26 23:49:36

观察者模式

观察者模式包含观察目标和观察者两类对象。一个目标可以有任意数目的与之相依赖的观察者。一旦观察目标的状态发生改变,所有的观察者都将得到通知。

当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新,解决了主体对象与观察者之间功能的耦合,即一个对象状态改变给其他对象通知的问题。

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

    add(observer) {
        this.observers.push(observer)
    }

    remove(observe) {
        this.observers = this.observers.filter(observer => observer !== observe)
    }

    notify() {
        this.observers.forEach(observer => {
            observer.update()
        })
    }
}
class Observer {
    constructor(name) {
        this.name = name
    }
    update() {
        console.log(this.name, 'update')
    }
}

const subject = new Subject();
const observer1 = new Observer('liu');
const observer2 = new Observer('hao')

subject.add(observer1)
subject.add(observer2)
subject.notify() // liu update hao update

前端通常的应用是导航和面包屑,面包屑发生改变,对应的页面内容也会发生改变。

优势:目标者与观察者,功能耦合度降低,专注自身功能逻辑;观察者被动接收更新,时间上解耦,实时接收目标者更新状态。

缺点:观察者模式虽然实现了对象间依赖关系的低耦合,但却不能对事件通知进行细分管控,如“筛选通知”,“指定主题事件通知”。

订阅发布模式

  1. 观察者和目标要相互知道
  2. 发布者和订阅者不用互相知道,通过第三方实现调度,属于经过解耦合的观察者模式

在这里插入图片描述

// 发布订阅模式
class PubSub {
    constructor() {
        this.subscribers = {};
    }

    subscribe(type, callback) {
        if (!this.subscribers[type]) {
            this.subscribers[type] = [];
        }
        this.subscribers[type].push(callback);
    }

    publish(type, ...args) {
        if (this.subscribers[type]) {
            this.subscribers[type].forEach(callback => {
                callback(...args);
            });
        }
    }

    unsubscribe(type, callback) {
        if (this.subscribers[type]) {
            this.subscribers[type] = this.subscribers[type].filter(cb => cb !== callback);
        }
    }
}

function eventA() {
    console.log('eventA');
}
function testB() {
    console.log('testB');
}

const pubSub = new PubSub();
pubSub.subscribe('eventA', eventA);
pubSub.subscribe('testB', testB);
pubSub.publish('eventA');

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2054796.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

《机器学习》逻辑回归 梯度下降、混淆矩阵、随机种子、正则化惩罚 No.6

一、混淆矩阵 1、什么是混淆矩阵? 混淆矩阵是用于评估分类模型在不同类别上的预测准确性的工具。它提供了模型预测结果与真实结果之间的对应关系,帮助我们分析和理解模型的分类性能。 假设,要对15个人预测是否患病,使用1表示患病…

生产环境中MapReduce的最佳实践

目录 MapReduce跑的慢的原因 MapReduce常用调优参数 1. MapTask相关参数 2. ReduceTask相关参数 3. 总体调优参数 4. 其他重要参数 调优策略 MapReduce数据倾斜问题 1. 数据预处理 2. 自定义Partitioner 3. 调整Reduce任务数 4. 小文件问题处理 5. 二次排序 6. 使用…

【python与java的区别-03(集合、字典)】

一、Set python: 集合(set)是一个无序的不重复元素序列。 集合中的元素不会重复,并且可以进行交集、并集、差集等常见的集合操作。 可以使用大括号 { } 创建集合,元素之间用逗号 , 分隔, 或者也可以使用 set() 函数…

【解释器模式】设计模式系列:构建动态语言解释器与复杂表达式处理(深入理解并实现)

文章目录 深入理解并实现解释器模式1. 引言1.1 解释器模式的定义1.2 模式的主要优点和缺点1.3 适用场景1.4 实际应用案例简介 2. 解释器模式的基本概念2.1 模式的核心思想2.2 模式的角色2.3 模式的动态行为分析 3. 解释器模式的工作原理3.1 如何构建表达式树3.2 如何通过递归遍…

可达鸭举牌网页版本在线生成源码html5

源码介绍 可达鸭举牌网页版本,在线生成源码,点击分享即可制作DIY自己的举牌文字网页,需要GIF动图的自行用GIF图片录制工具录制下来。 PS:上传到服务器运行或者本地nginx运行,不要双击index.html,如果本地双击HTML&…

【3】AT32F437 OpenHarmony轻量系统第一个程序:点灯

在搭建好AT32F437 OpenHarmony 轻量系统之后,当然要尝试点一下灯了。 编写点灯程序 笔者在适配OpenHarmony轻量系统的时候,只对源码的device和vendor目录进行了修改,AT32的app目录笔者放置在了vendor/tree/master/artery/AT-START-F437/app…

什么是网络安全?网络安全防范技术包括哪些?

一、引言 在当今数字化的时代,网络已经成为人们生活和工作中不可或缺的一部分。然而,随着网络的普及和应用的广泛,网络安全问题也日益凸显。从个人隐私泄露到企业关键信息被盗,从网络欺诈到大规模的网络攻击,网络安全…

在国产芯片上实现YOLOv5/v8图像AI识别-【2.5】yolov8使用C++部署在RK3588更多内容见视频

本专栏主要是提供一种国产化图像识别的解决方案,专栏中实现了YOLOv5/v8在国产化芯片上的使用部署,并可以实现网页端实时查看。根据自己的具体需求可以直接产品化部署使用。 B站配套视频:https://www.bilibili.com/video/BV1or421T74f 背景…

ubuntu 安装两个nginx实例时的坑,非默认nginx实例配置修改总也不生效的问题

一、问题 由于工作需求xx云服务器上安装了两个nginx实例,突然有一天需要在非默认nginx上增加一个子站点,根据网上教程和原来的记录修改vi nginx.conf 后保存载总也不生效? 怎么破? 二、过程记录 假如:非默认nginx安装在…

HanLP分词的使用与注意事项

1 概述 HanLP是一个自然语言处理工具包&#xff0c;它提供的主要功能如下&#xff1a; 分词转化为拼音繁转简、简转繁提取关键词提取短语提取词语自动摘要依存文法分析 下面将介绍其分词功能的使用。 2 依赖 下面是依赖的jar包。 <dependency><groupId>com.ha…

使用SSH协议远程连接Ubuntu

1.切换到root用户 sudo -i 2.安装openssh-server apt update apt install openssh-server 3.启动ssh服务 service ssh start 4.查看ssh状态 &#xff08;q键: 退出&#xff09; service ssh status 5.检查ssh服务是否启动成功 ps -e | grep ssh 6.开机自启动 systemctl enable …

基于STM32F103的FreeRTOS系列(九)·任务创建函数的使用·静态方法和动态方法

目录 1. 前期准备 1.1 中断文件修改 1.2 SysTick文件修改 1.3 任务创建函数API 2. 任务创建&#xff08;静态方法&#xff09; 2.1 创建两个任务函数 2.2 静态创建开始任务函数 2.3 创建开始任务的任务函数 2.4 补充 2.5 代码 3. 任务创建&#xff08;动…

【python基础】—利用pandas读取或写入mysql表数据

文章目录 一、read_sql()二、to_sql()三、连接数据库方式—MySQL1、用sqlalchemy包构建数据库链接2、用DBAPI构建数据库链接 四、容易遇到的问题 一、read_sql() 功能 将 SQL 查询/数据库表读入 DataFrame。 语法 读取数据库&#xff08;通过SQL语句或表名&#xff09; pand…

【书生大模型实战营(暑假场)闯关材料】基础岛:第4关 InternLM + LlamaIndex RAG 实践

基础任务 (完成此任务即完成闯关) 任务要求&#xff1a; 基于 LlamaIndex 构建自己的 RAG 知识库&#xff0c;寻找一个问题 A 在使用 LlamaIndex之前InternLM2-Chat-1.8B模型不会回答&#xff0c;借助 LlamaIndex 后 InternLM2-Chat-1.8B模型具备回答 A 的能力&#xff0c;截图…

SQL-约束篇

在数据库设计中&#xff0c;约束是确保数据完整性和准确性的关键元素。约束可以限制表中数据的类型、范围和关系&#xff0c;从而维护数据的一致性和可靠性。 1. 主键约束 (Primary Key) 主键约束用于唯一标识表中的每一行数据。一个表只能有一个主键&#xff0c;主键字段的值…

计算机毕业设计SpringBoot-VUE-python-nodeJS铁路列车安全管理-评估报告-铁路局-客运-货运-行车-站段-天气情况

1 引言 1.1 项目开发的背景 我国的普铁历史悠久&#xff0c;从19世纪至今已有百来年的历史。新中国以来&#xff0c;铁路的发展速度令人惊叹。但随着发展速度的增快&#xff0c;与之不对应的则是运营安全管理系统的落后。但这些来&#xff0c;我国铁路对于安全的重视程度已经…

代码随想录算法训练营第十六天(二叉树 四)

力扣题部分: 513.找树左下角的值 题目链接:. - 力扣&#xff08;LeetCode&#xff09; 题面: 给定一个二叉树的 根节点 root&#xff0c;请找出该二叉树的 最底层 最左边 节点的值。 假设二叉树中至少有一个节点。 思路(层序遍历): 应该是这道题最简单的方法了&#xff0…

超文本文档HTML

简单的个人网站 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>欢迎来到我的主页</title> &…

【HarmonyOS】鸿蒙应用蓝牙功能实现 (二)

【HarmonyOS】鸿蒙应用蓝牙功能实现 &#xff08;二&#xff09; 前言 蓝牙一般分为传统蓝牙(BR/EDR)&#xff0c;低功耗蓝牙(BLE)两种。 鸿蒙将蓝牙的功能模块分的非常细。 基本上我们会用到access进行蓝牙状态的开启和关闭&#xff0c;以及状态查询。 在使用connection进…

BUUCTF PWN wp--warmup_csaw_2016

第一步 先checksec一下&#xff08;没有启用NX保护、PIE、完整的RELRO和栈保护&#xff0c;还有具有RWX权限的内存段。&#xff09; 分析一下这个文件的保护机制&#xff1a; Arch: amd64-64-little 这表示该可执行文件是为64位的AMD64架构编译的&#xff0c;并且使用的是小…