首页 > 代码库 > javascript设计模式-观察者模式
javascript设计模式-观察者模式
观察者模式定义了一种一对多的关系,让多个观察者对象同时监听某一个主题对象,这个对象的状态发生变化时就会通知所有的观察者对象,使得它们能够自动更新自己。
例子:杂志订阅
发布者包含一些方法:
var publisher = { subscribers:function(fn,type){ type = type ||"any"; if(typeof this.subscribers[type] ==="undefined"){ this.subscribers[type] = []; } this.subsribers[type].push(fn); }, unsubscribe:function(fn,type){ this.visitSubscribers("unsubscribe",fn,type); }, unsubscribe:function(publication,type){ this.visitSubscribers("publish",publication,type); }, visitSubscribers:function(function,arg,type){ var pubtype = type || "any", subscribers = this.subscribers[pubtype], i, max = subscribers.length; for(i=0 ; i<max ; i++){ if(action ==="publish"){ subscribers[i](arg); }else{ if(subscribers[i] === arg){ subscribers.splice(i,1); } } } }};
下面的函数接受一个对象,通过把上述发布者的方法复制到该对象,将其转化为一个发布者:
function makePublisher(o){ var i; for(i in publisher){ if(publisher.hasOwnProperty(i)&&typeof[i] ==="function"){ o[i]=publisher[i]; } } o.subscribers={any:[]};}
paper对象,发布日报和月刊:
var paper={ daily:function(){ this.publish("big news today"); }, monthly:function(){ this.publish("interesting things","monthly"); }};
将paper构造成发行者:
makePublisher(paper);
订阅者joe:
var joe = { drinkCoffee:function(paper){ console.log("Just read"+paper); }, sundayPreNap:function(monthly){ console.log("About to fall asleep to read this"+monthly); }};
订阅:
paper.subscribe(joe.drinkCoffee);paper.subscribe(joe.sundayPreNap,"monthly");
触发一些事件:
paper.daily();paper.daily();paper.daily();paper.monthly();
输出:
Just read big news todayJust read big news todayJust read big news todayAbout to fall asleep reading this interesting things
观察者的使用场合是:当一个对象的改变需要同时改变其它对象,并且它不知道具体有多少对象需要改变的时候,就应该考虑使用观察者模式。
观察者模式所做的工作就是在解耦,让耦合的双方都依赖于抽象,而不是依赖于具体。从而使得各自的变化都不会影响到另一边的变化。
javascript设计模式-观察者模式
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。