设计模式 ~ 观察者模式-编程知识

设计模式 ~ 观察者模式

概念

观察者模式是一种设计模式，也被称为发布-订阅模式或事件模式；
用于在对象之间建立一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都会得到通知并自动更新；
~
如：DOM事件、vue / React 生命周期、各种异步回调 ~ 定时器、Promise.then、nodeJs 流式读取、端口监听

代码演示

存在两个角色：主题（Subject）和观察者（Observer）：
主题是被观察对象，它维护一组观察者对象并通知它们；
观察者是依赖于主题的对象，它们注册自己到主题以便于主题状态改变接收通知，并执行响应操作；

Subject： 可以理解为饮品店的吧台，当完成会通知你去拿取

class Subject {private state: number = 0 // 状态private observers: Observer[] = [] // 观察者们// 获取状态getState(): number {return this.state}// 设置状态setState(newState: number) {this.state = newStatethis.notify() // 通知}// 添加观察者attach(observer: Observer) {this.observers.push(observer)}// 通知private notify() {this.observers.forEach(observer => {observer.update(this.state)})}
}

Observer : 可以理解为饮品店的顾客，等待吧台的通知

class Observer {name: stringconstructor(name: string) {this.name = name}// 通知update(state: number) {console.log(`${this.name} updated, state is ${state}`)}
}

创建观察者对象

const sub = new Subject()
const observer1 = new Observer('A')
const observer2 = new Observer('B')
sub.attach(observer1)
sub.attach(observer2)
sub.setState(1)