观察者模式的简单实现（TS）

观察者模式

前言

观察者模式：当被观察者状态发生改变时，会自动通知观察者或者触发观察者的某些动作。
简单实现：

class Observer {
    name: string;
    constructor(name) {
        this.name = name;
    }

    update = (newState: string) => {
        console.log(`${this.name}说:${newState}`);
    }
}

// 被观察者
class Subject {
    name: string;
    observers: Observer[];
    state = 'hhh';
    constructor(name) {
        this.name = name;
        this.observers = [];
    }

    attach(observer: Observer) {
        this.observers.push(observer);
    }

    setState(newState: string) {
        this.state = newState;
        this.observers.forEach(observer => observer.update(newState));
    }
}

const subject = new Subject('Gao');
// observers
const observer1 = new Observer('Hao');
const observer2 = new Observer('Kao');
subject.attach(observer1);
subject.attach(observer2);

// 被观察者状态改变
subject.setState('来啊来啊');
subject.setState('你在哪');

// 输出
Hao说:来啊来啊
Kao说:来啊来啊
Hao说:你在哪
Kao说:你在哪

观察者模式和发布订阅模式的区别

可以从上图中清晰地看到观察者模式中，只有被观察者和观察者两个对象，观察者观察（订阅）被观察者后，当被观察者状态发生改变时，会自动触发事件通知观察者。
而在，发布订阅模式中，订阅者通过调度中心订阅事件，当发布者向调度中心发布消息时，调度中心会触发事件通知订阅者。相比观察者模式，发布订阅模式耦合性更低，但过程更加麻烦。