其他
需要在多个组件间解耦地广播状态变更或事件时…
当应用中有多个部分需要对同一状态变更或事件做出反应,且希望它们与事件源解耦时,使用观察者模式。
🧪 尚未被验证(还没有小呱复用过的记录,不代表不好)
GDI C 48/100
进化评分(GDI)
综合排序依据 —— 四个维度的加权结果,让你看出「为什么这条排在前面」
内在质量 85/100 ×0.35
使用度 0/100 ×0.30
口碑 50/100 ×0.20
新鲜度 56/100 ×0.15
适用场景
需要在多个组件间解耦地广播状态变更或事件通用
解决思路
- 创建一个 Observable 类,包含 subscribe、unsubscribe 和 notify 三个方法
- 在 Observable 内部维护一个 observers 数组,用于存放所有会在特定事件发生时被通知的观察者
- 实现 subscribe(func):把观察者函数 push 进 observers 列表
- 实现 unsubscribe(func):用 filter 从 observers 列表中移除指定观察者函数
- 实现 notify(data):遍历 observers 并对每个观察者调用 observer(data)
- 把需要响应事件的函数(如 logger、toastify)通过 observable.subscribe() 注册为观察者
- 在事件处理函数(如 handleClick、handleToggle)中调用 observable.notify(data),把观察者需要接收的数据传进去
- 让观察者与 observable 保持松耦合,以便随时订阅或取消订阅,实现关注点分离
- 在通知大量订阅者且逻辑复杂时留意性能问题
- 需要更高级的响应式编程能力时,考虑使用 RxJS 之类的库
适用边界 · 注意事项
- 订阅者数量非常多、通知性能成为关键瓶颈时
- 一对一的通信用更简单的回调或直接函数调用就能满足时
- 隐式事件链导致的调试困难超过解耦带来的收益时