标签：
观察者模式定义对象间的一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都将得到通知。
JavaScript中通常采用事件模型替代传统的观察者模式
以客户看房为例
首先指定谁充当发布者，如售楼处
然后给发布者添加一个缓存列表，用于存放回调函数以便通知订阅者。这里为了让订阅者只接收自己感兴趣的消息，增加一个标识key
最后发布消息时候，发布者遍历缓存列表，依次触发里面存放的订阅者的回调函数
var salesOffices={}; salesOffices.clientList=[]; salesOffices.listen=function(key,fn){ if(!this.clientList[key]){ this.clientList[key]=[]; } this.clientList[key].push(fn); } salesOffices.trigger=function(){ var key=Array.prototype.shift.call(arguments), fns=this.clientList[key]; if(!fns || fns.length === 0){ return false; } for(var i=0,fn;fn=fns[i++];){ fn.apply(this,arguments); } } salesOffices.listen(‘squareMeter88‘,function(price){//A订阅88平房子消息 console.log(‘价格=‘+price); }); salesOffices.listen(‘squareMeter100‘,function(price)){//B订阅100平房子消息 console.log(‘价格=‘+price); } salesOffices.trigger(‘squareMeter88‘,200000); salesOffices.trigger(‘squareMeter100‘,300000);
var Event=(function(){ var clientList={}, listen, trigger, remove; listen=function(key,fn){ f(!this.clientList[key]){ this.clientList[key]=[]; } this.clientList[key].push(fn); }; trigger=function(){ var key=Array.prototype.shift.call(arguments), fns=this.clientList[key]; if(!fns || fns.length === 0){ return false; } for(var i=0,fn;fn=fns[i++];){ fn.apply(this,arguments); } }; remove=function(key,fn){ var fns=clientList[key]; if(!fns){ return false; } if(!fn){ fns&&(fns.length=0);//没指定fn时，删除全部 }else{ for(var l=fns.length-1;l>=0;l--){ var _fn=fns[l]; if(_fn === fn){ fns.splice(l,1); } } } }; return{ listen:listen, trigger:trigger, remove:remove } })(); Event.listen(‘squareMeter88‘,function(price){//A订阅88平房子消息 console.log(‘价格=‘+price); }); Event.trigger(‘squareMeter88‘,200000);
《JavaScript设计模式与开发实践》读书笔记之观察者模式
标签：
原文地址：http://www.cnblogs.com/GongQi/p/4652770.html
