4
行为型：观察者模式 - 风吹De麦浪
source link: https://www.cnblogs.com/longbensong/p/17270890.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
观察者模式属于行为型模式，它定义了对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都将得到通知，并自动更新。
一种一对多的关系中一称为被观察者也叫目标对象Subject而多则称为观察者对象Observer
观察者模式中通常有两个模型，一个观察者（observer）和一个被观察者（Observed）。从字面意思上理解，即被观察者发生某些行为或者变化时，会通知观察者，观察者根据此行为或者变化做出处理。
特征：
-
- 一个目标者对象
Subject，拥有方法：添加、删除、通知 Observer； - 多个观察者对象
Observer，拥有方法：接收 Subject 状态变更通知并处理； - 目标对象
Subject状态变更时，通知所有Observer。
- 一个目标者对象
生活中的例子
如我们关注了某某订阅号，当订阅号有新的文章时，我们都收到了推文，这个就是最简单的观察者模式。
模拟观察者模式
/*定义：观察者模式是一种对象行为模式。它定义对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都得到通知并被自动更新。 js 没有抽象类、接口 所以一般结构如下：subject 目标 or 被观察者： add: 把观察者注册进来 remove: 移除观察者 notify: 遍历注册进来的观察者，调用他们的update Observer 观察者： update: 自己提供的更新方法*/ // 被观者、目标class Subject { constructor (data) { this.observers = [] this.data = data } addObserver (data) { this.observers.push(data) } removeObserver (data) { this.observers = this.observers.filter(t => t !== data) } notify (...data) { this.observers.forEach(observer => observer.update(...data)) } // 你的业务代码 setData (data) { this.data= data; this.notify(data) }} // 观察者class Observer { constructor (name) { this.name = name } update (data) { console.log(`${this.name}, 我执行了，${data}发生了变化`) }} const sub = new Subject('我是被观察')const ob1 = new Observer('我是ob1')const ob2 = new Observer('我是ob2')const ob3 = new Observer('我是ob3')sub.addObserver(ob1)sub.addObserver(ob2)sub.addObserver(ob3)sub.notify('现在开始发送第一个通知')console.log('**************看看ob1 是不是没有收到第二个通知**************')sub.removeObserver(ob1)sub.notify('现在开始发送第二个通知')
- 观察者模式用来解决对象之间存在一对多关系的交互行为
- 观察者模式中，被观察者与观察者解藕没有很彻底，且在被观察者中观察者要提供统一的更新方法，当然这也是要看具体的应用场景，在某些模块本身就是存在关联，那用观察者模式也没问题。
- 发布订阅虽然与观察者模式解决的问题的思路差不多，但是这两个还是有区别的。
如果您觉得阅读本文对您有帮助，请点一下推荐按钮，您的推荐将是我最大的写作动力，欢迎各位转载！
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK