TypeScript 设计模式之【观察者模式】

news/2024/10/4 21:00:21/

文章目录

在这里插入图片描述

观察者模式:构建灵活响应的事件通知系统

每当有订阅热点事件发生时,你都会立即收到通知。这个过程中,你就像一个"观察者",而热点事件应用则是"被观察者"。这种实时更新的机制,正是观察者模式的生动体现。

软件开发中,我们经常需要处理对象之间的一对多依赖关系,一个对象状态改变时,所有依赖于它的对象都能得到通知并自动更新。观察者模式类似一个智能的通知系统,能够在保持对象之间松耦合的同时,灵活处理事件!

观察者模式的奥秘

观察者模式定义了一种一对多的依赖关系,让多个观察者对象同时监听某一个主题对象。这个主题对象在状态发生变化时,会通知所有观察者对象,使它们能够自动更新自己。

观察者模式有什么利与弊?

观察者模式的优点是它支持广播通信,增加了灵活性和可扩展性。它遵循开闭原则,使得我们可以在不修改现有代码的情况下添加新的观察者。缺点是如果处理不当,会引起性能问题和循环依赖。

如何使用观察者模式来优化你的系统

观察者模式涉及角色

  • 主题(Subject): 定义添加、删除和通知观察者的接口
  • 具体主题(ConcreteSubject): 实现主题接口,维护观察者列表,发生变化时通知观察者
  • 观察者(Observer): 定义一个更新接口,使在主题状态变化时得到通知
  • 具体观察者(ConcreteObserver): 实现观察者更新接口,以便在得到通知时进行自我更新

观察者模式步骤

  1. 创建一个主题接口,定义添加、删除和通知观察者的方法
  2. 创建一个观察者接口,定义更新方法
  3. 实现具体主题类,维护观察者列表,实现通知逻辑
  4. 实现具体观察者类,定义在收到通知时的具体行为
  5. 在主题状态改变时,通知所有注册的观察者

选择合适的观察者模式,你就能轻松地实现对象之间的解耦,让系统变得更加灵活和可扩展!

代码实现案例

typescript">// 观察者接口
interface Observer {update(message: string): void;
}// 主题接口
interface Subject {// 附加attach(observer: Observer): void;// 脱离detach(observer: Observer): void;// 通知notify(message: string): void;
}// 具体主题:新闻发布者
class NewsPublisher implements Subject {private observers: Observer[] = [];attach(observer: Observer): void {const isExist = this.observers.includes(observer);if (isExist) {return console.log("观察者已经存在,无需重复添加");}this.observers.push(observer);console.log("观察者已添加");}detach(observer: Observer): void {const observerIndex = this.observers.indexOf(observer);if (observerIndex === -1) {return console.log("未找到要删除的观察者");}this.observers.splice(observerIndex, 1);console.log("观察者已被移除");}notify(message: string): void {console.log("通知所有观察者");for (const observer of this.observers) {observer.update(message);}}publishNews(news: string): void {console.log(`发布新闻: ${news}`);this.notify(news);}
}// 具体观察者:新闻订阅者
class NewsSubscriber implements Observer {private name: string;constructor(name: string) {this.name = name;}update(message: string): void {console.log(`${this.name} 收到新闻: ${message}`);}
}
// 客户端代码
const publisher = new NewsPublisher();const subscriber1 = new NewsSubscriber("张三");
const subscriber2 = new NewsSubscriber("李四");
const subscriber3 = new NewsSubscriber("王五");publisher.attach(subscriber1);
publisher.attach(subscriber2);
publisher.attach(subscriber3);publisher.publishNews("中国成功发射神舟十八号载人飞船!");publisher.detach(subscriber2); // 李四通知被移除publisher.publishNews("2023年高考开始了!");// 输出
// 观察者已添加
// 观察者已添加
// 观察者已添加
// 发布新闻: 中国成功发射神舟十八号载人飞船!
// 通知所有观察者
// 张三 收到新闻: 中国成功发射神舟十八号载人飞船!
// 李四 收到新闻: 中国成功发射神舟十八号载人飞船!
// 王五 收到新闻: 中国成功发射神舟十八号载人飞船!
// 观察者已被移除
// 发布新闻: 2023年高考开始了!
// 通知所有观察者
// 张三 收到新闻: 2023年高考开始了!
// 王五 收到新闻: 2023年高考开始了!

在这里插入图片描述

观察者模式的主要优点

  1. 松耦合: 主题和观察者之间是松散耦合的,它们依然可以独立地改变
  2. 支持广播通信: 主题无需知道观察者的具体类,只需通知所有观察者
  3. 灵活性和可扩展性: 可以动态地增加或删除观察者,无需修改主题
  4. 符合开闭原则: 无需修改主题就可以引入新的观察者类

观察者模式的主要缺点

  1. 引起性能问题: 如果观察者数量太多,通知所有观察者会花费较多时间
  2. 导致循环依赖: 观察者和主题之间可能出现循环依赖
  3. 通知次序不可控: 不保证通知顺序,可能导致不一致的状态
  4. 意外的更新: 如果观察者之间有依赖关系,可能导致意外的更新

观察者模式的适用场景

  1. 当一个抽象模型有两个方面,其中一个方面依赖于另一个方面时
  2. 当对一个对象的改变需要同时改变其他对象,而不知道具体有多少对象待改变时
  3. 当一个对象必须通知其他对象,而它又不能假定其他对象是谁时
  4. 需要在系统中创建一个触发链时

总结

观察者模式是一种行为型设计模式,它定义了一种一对多的依赖关系,让多个观察者对象同时监听某一个主题对象。当主题对象的状态发生变化时,所有依赖于它的观察者都会得到通知并自动更新。观察者模式通过解耦主题和观察者,提高了系统的灵活性和可扩展性。合理使用观察者模式,可以让你的代码更加模块化,更易于维护和扩展。

喜欢的话就点个赞 ❤️,关注一下吧,有问题也欢迎讨论指教。感谢大家!!!

下期预告: TypeScript 设计模式之【状态模式】


http://www.ppmy.cn/news/1534600.html

相关文章

Yolov11项目实战1:道路缺陷检测系统设计【Python源码+数据集+运行演示】

一、项目背景 随着城市化进程的加速和交通网络的不断扩展,道路维护成为城市管理中的一个重要环节。道路缺陷(如裂缝、坑洞、路面破损等)不仅影响行车安全,还会增加车辆的磨损和维修成本。传统的道路缺陷检测方法主要依赖人工巡检…

【docker学习】Linux系统离线方式安装docker环境方法

centos7-linux安装docker(离线方式) 下载docker的安装文件 https://download.docker.com/linux/static/stable/x86_64/ 下载的是:docker-18.06.3-ce.tgz 这个压缩文件 将docker-18.06.3-ce.tgz文件上传到centos7-linux系统上,用ftp工具上传即可 解压…

Java高效编程(16):在公共类中使用访问器方法,而不是公共字段

概述 在软件设计中,封装是面向对象编程的基本原则之一。为了确保灵活性和安全性,公共类应通过访问器方法(getter)和修改器方法(setter)来访问字段,而不是直接暴露公共字段。这有助于后续的维护和修改。 退化类的示例 有时候,您可能会倾向于编写退化的类,这些类的唯…

【PostgreSQL 】实战篇——深入讨论分区表的概念、创建和管理方法,以及其在性能优化中的应用

一、背景与重要性 数据量的迅速增长对性能和管理提出了更高的要求,尤其是在处理大量数据时,传统的单表结构可能会导致查询性能下降、数据维护困难和存储管理不便。 为了解决这些问题,PostgreSQL 提供了分区表(Partitioned Table…

资源《Arduino 扩展板4-单游戏摇杆》说明。

资源链接: Arduino 扩展板4-单游戏摇杆 1.文件明细: 2.文件内容说明 包含:AD工程、原理图、PCB。 3.内容展示 4.简述 该文件为PCB工程,采用AD做的。 该文件打板后配合Arduino使用,属于Arduino的扩展板。 该文件…

华为手机连接蓝牙音响后播放声音小的问题分析

当你的华为 P70Pro 手机通过蓝牙连接到音响后,虽然将手机音量调到最大,但音响播放的声音依然很小,背后可能存在多个技术因素和设定上的问题。要理解这一现象,我们可以从设备的音量控制机制、蓝牙协议的限制、音频编码与传输的影响…

51单片机的宠物自动投喂系统【proteus仿真+程序+报告+原理图+演示视频】

1、主要功能 该系统由AT89C51/STC89C52单片机LCD1602显示模块温湿度传感器DS1302时钟模块蓝牙步进电机按键、蜂鸣器等模块构成。适用于猫猫/狗狗宠物自动喂食器等相似项目。 可实现基本功能: 1、LCD1602实时显示北京时间和温湿度 2、温湿度传感器DHT11采集环境温湿度 3、时…

html+css+js实现Collapse 折叠面板

实现效果&#xff1a; HTML部分 <div class"collapse"><ul><li><div class"header"><h4>一致性 Consistency</h4><span class"iconfont icon-jiantou"></span></div><div class"…