观察者与发布订阅的异同:
1. 观察者简言之,就是多个角色间互相监听,也就是说,任何一个角色(对象)变化,其他的都可以知道。
2. 发布订阅为,创建一个中心角色,其余角色的通信都经过中心角色进行。
相同点: 都是角色间进行观察(通信,监听)
不同点:观察者是所有角色互相观察(通信,监听),发布订阅则是在观察者基础上,由统一角色进行观察(通信,监听)。
总结:观察者模式可以算作是发布订阅模式的超集(即观察包括发布订阅),发布订阅可以算是观察者的一个分支,但因其应用广泛,渐渐的被承认为一个单独的设计模式。
观察者模式简单实现:
// 创建构造函数
let People = function (pn,pa) {
this.name = pn
this.age = pa
}
// 调用此方法生产people
let CreatePeople = function (name,age,say) {
// 储存所有成员
if(People.prototype.peopleList){
People.prototype.peopleList.push({
name,
age,
say
})
} else {
People.prototype.peopleList = [{name, age, say}]
}
// 为成员添加获取所有成员say的方法
People.prototype.getData = function () {
People.prototype.peopleList.forEach(item=>{
item.say(this)
})
}
// 返回处理好的people
return new People(name,age,say)
}
// 创建三个people
let XiaoMing = CreatePeople('小明',16,(arrow)=>{
console.log(`我叫${arrow.name},今年${arrow.age}岁`)
})
let XiaoMai = CreatePeople('小埋',16,(arrow)=>{
console.log(`我叫${arrow.name},今年${arrow.age}岁`)
})
let XiaoGang = CreatePeople('小刚',16,(arrow)=>{
console.log(`我叫${arrow.name},今年${arrow.age}岁`)
})
// 小明获取所有人的自我介绍
XiaoMing.getData()
发布订阅简单实现:
// 消息中心构造函数
let Construct = function () {
this.messageCenter = []
this.log = []
}
// 实例化平台消息中心
let messageCenter = new Construct()
// 创建用户构造函数
let User = function (name) {
this.name = name
}
// 为用户添加加入交流平台方法
User.prototype.join = function(){
messageCenter.messageCenter.push(this.name)
}
// 为用户添加发布言论方法
User.prototype.say=function (message) {
if (messageCenter.messageCenter.includes(this.name)) {
messageCenter.log.push(`${this.name}: ${message}`)
} else {
console.log('还没登录哦')
}
}
// 为用户添加获取全部订阅用户发言方法
User.prototype.getAllLog = function (){
console.log(messageCenter.log)
}
// 创建用户及发言
let XiaoHong = new User('小红')
XiaoHong.join()
XiaoHong.say('大家好!')
XiaoHong.getAllLog()
let XiaoLi = new User('小李')
XiaoLi.say('大家好!')
XiaoLi.getAllLog()
每次想写这两种模式,总是记混。在此简单记录下,细节可能缺少推敲,仅供参考,如有帮助欢迎点赞。