观察者模式已经是比较常见的设计模式了,并且使用的频率也比较高,
那么我们什么时候用,简而言之就是,当我们一个主体改变,它所有下级要跟着改变的时候就需要用了,比如:换肤,全局数据修改,有点类似于全局状态机,只不过它可以监听改变的过程。
下面以一张图简单了解下:
下面代码讲解下:
首先创建一个被观察者
constructor(){
this.observerList = []
}
addObserver(observer){
this.observerList.push(observer)
}
removeObserver(observer){
const index = this.observerList.findIndex((item)=>item.name === observer.name)
this.observerList.splice(index,1)
}
notifyObservers(message){
const observers = this.observerList
observers.forEach(item => {
item.notified(message)
});
}
}
创建观察者
class Observer{
constructor(name,Subject){
this.name = name
if(Subject){
Subject.addObserver(this)
}
}
notified(message){
console.log(this.name,message )
}
}
配合使用
const subject = new Subject()
const observer = new Observer('观察者1号',subject) // 加入观察者
const observer2 = new Observer('观察者2号')
subject.addObserver(observer2)// 加入观察者
subject.notifyObservers('起飞了')`
实现结果
有帮助到你点个赞吧!