观察者模式是一种行为设计模式,允许一个对象将其状态的改变通知其他对象。
观察者模式提供了一种作用于任何实现了订阅者接口的对象的机制, 可对其事件进行订阅和取消订阅。
Subject部分
interface Subject {
// 添加观察者
attach(observer: Observer): void;
// 移除观察者
detach(observer: Observer): void;
// 通知所有观察者
notify(): void;
}
class ConcreteSubject implements Subject {
// 发布者状态,测试使用
public state: number;
// 订阅者名单
public observers: Array<Observer> = [];
// 管理订阅方法
public attach(observer: Observer): void {
const observerIndex = this.observers.indexOf(observer);
if (observerIndex !== -1) {
return console.log('已订阅');
}
this.observers.push(observer);
console.log('订阅成功');
}
public detach(observer: Observer): void {
const observerIndex = this.observers.indexOf(observer);
if (observerIndex === -1) {
return console.log('订阅者未订阅');
}
this.observers.splice(observerIndex,1);
console.log('订阅者已移除');
}
public notify(): void {
console.log('通知所有订阅者');
for (const observer of this.observers) {
observer.update(this);
}
}
// 订阅管理以外的逻辑
public someLogic() {
this.state = Math.floor(Math.random() * 10 + 1);
console.log(`我更改了我的状态:state=${this.state}`);
this.notify();
}
}
Observer部分
interface Observer {
// 对发布者发出的更新消息作出回应
update(subject: Subject): void;
}
//具体观察者A
class ConcreteObserverA implements Observer {
public update(subject: ConcreteSubject) {
if (subject.state <= 5) {
console.log('观察者A作出回应');
}
}
}
// 具体观察者B
class ConcreteObserverB implements Observer {
public update(subject: ConcreteSubject) {
if (subject.state > 5) {
console.log('观察者B作出回应');
}
}
}
测试代码
const subject = new ConcreteSubject();
const observerA = new ConcreteObserverA();
subject.attach(observerA);
const observerB = new ConcreteObserverB();
subject.attach(observerB);
subject.someLogic();
subject.detach(observerB);
subject.someLogic();