简介

观察者模式指的是函数自动观察数据对象，一旦对象有变化，函数就会自动执行。而 JS 中最常见的观察者模式就是事件触发机制。

观察者模式：定义对象间一种一对多的依赖关系，当目标对象 Subject 的状态发生变化时，所有依赖它的对象 Observer 都会得到通知。

模式特征

一个目标对象 Subject，拥有方法：添加/删除/通知 Observer;
多个观察者对象 Observer，拥有方法：接收 Subject 状态变更通知并处理；
目标对象 Subject 状态变更时，通知所有 Observer;

class Subject {
    constructor() {
        // 观察者列表
        this.observers = [];
    }

    // 添加
    add(observer){
        this.observers.push(observer);
    }
    // 删除
    remove(observer){
        let idx = this.observers.findIndex(item => item === observer);
        idx > -1 && this.observers.splice(idx, 1);
    }
    // 通知
    notify(){
        for(let observer of this.observers){
            observer.update();
        }
    }
}

class Observer {
    constructor(name){
        this.name = name;
    }
    // 目标对象更新时触发的回调
    update(){
        console.log(`目标者通知我更新了，我是：${this.name}`);
    }
}

// 实例化目标者
let subject = new Subject();

//  实例化两个观察者
let obs1 = new Observer('前端开发者');
let obs2 = new Observer('后端开发者');

// 向目标者添加观察者
subject.add(obs1);
subject.add(obs2);

// 向目标者通知更新
subject.notify();

JS 观察者模式

简介