怎么利用观察者模式实现对象间的一对多状态变更自动通知与解耦-java教程-PHP中文网

观察者模式的核心是主题自动通知观察者实现松耦合：主题管理状态与通知调度，观察者实现update响应；JavaScript可用Set实现基础结构，需契约化接口、最小化数据、禁止反向调用。

怎么利用观察者模式实现对象间的一对多状态变更自动通知与解耦

观察者模式的核心作用，就是让一个对象（主题）状态变化时，自动、透明地通知所有依赖它的对象（观察者），同时不暴露彼此内部实现——这正是“一对多通知”与“松耦合”的本质。

明确两个关键角色的职责

主题（Subject）不是“发消息的人”，而是“状态管理者+通知调度中心”：

它持有观察者列表，但不关心每个观察者具体做什么
它只在自身关键状态变更后调用 notify()，把数据（如新值、事件名、上下文）传出去
它提供 addObserver() 和 removeObserver()，支持运行时动态订阅/退订

观察者（Observer）不是“被动接收者”，而是“响应契约的执行方”：

它只需实现统一的 update(data) 方法，收到通知就按需处理
它可自行决定是否更新视图、触发计算、写日志或发起请求
它甚至可以持有对主题的弱引用，避免循环引用风险

用 JavaScript 快速落地一个可用结构

不需要框架，几行代码就能搭出可扩展基础：

class Subject {
  constructor() {
    this.observers = new Set(); // 用 Set 避免重复注册
  }
  addObserver(observer) {
    if (typeof observer.update === 'function') {
      this.observers.add(observer);
    }
  }
  removeObserver(observer) {
    this.observers.delete(observer);
  }
  notify(data) {
    this.observers.forEach(obs => obs.update(data));
  }
}

// 观察者只需有 update 方法，无需继承固定类
const logger = { update: msg => console.log('[LOG]', msg) };
const uiUpdater = { update: data => document.getElementById('status').textContent = data };

const bus = new Subject();
bus.addObserver(logger);
bus.addObserver(uiUpdater);
bus.notify('系统已就绪'); // 两者同时响应