观察者模式也可以称为订阅模式,是一种从发布,到订阅,再到通知的过程。
首先说什么是观察者模式:观察者模式就是定义了一个对象一对多的关系,让多个观察者同时监听一个大对象,当一个大对象发生变化时,所有的依赖它的对象都会得到通知。
比如说:淘宝上某店铺的某品牌的鞋子,有两个买家小张和小王,让他们去买鞋的时候,发现鞋子断码了,他们都问店主,这个鞋的码什么时候有货,店主回复他们说,点一下到货通知,货到了会通知你们。等到货了,通知他们,这个过程就是观察者模式的过程。
观察者模式(订阅模式)
以下说订阅模式(字少好打字)
订阅模式有五个重要的模块,分别是:发布者、发布列表、增加订阅者、发布消息、订阅者收到订阅消息。
发布者
很容易想到发布者肯定是一个一个对象
var obj = {}//发布者
发布列表
发布列表是发布者的一个方法(功能),用来存储订阅者的信息。
obj.list = []//发布列表
增加订阅者
obj.listen = function(key,fn){
if(!this.list[key]){
this.list[key] = [];
}
this.list[key].push(fn);
}
fn为回调函数,作为传入订阅者的信息。key值作为,每个订阅者订阅的不同商品,相同的放在一起。
发布消息
obj.message = function(){
var key = Array.prototype.shift.call(arguments); //取出消息类型名称,这里是红色
var fns = this.list[key]; //取出消息对应回调函数集合
if(!fns || fns.length == 0){ //如果没有订阅这个消息,直接返回
console.log(key + "还没有上货,请静心等待...");
return ;
}
for(var i = 0,fn; fn = fns[i++] ; ){
fn.apply(this,arguments);
}
}
订阅者接受消息
obj.listen("红色",function(size){ //订阅者
console.log("尺寸 :" + size);
})
obj.message("黑色",40);obj.message("红色",40);
![](https://i-blog.csdnimg.cn/blog_migrate/44f32d0808d6b1e2ce21542cfbc68c3b.png)
这就是观察者模式。