观察者与发布订阅的异同：

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()

每次想写这两种模式，总是记混。在此简单记录下，细节可能缺少推敲，仅供参考，如有帮助欢迎点赞。