(四)JS学习笔记 - 模式 - 观察者模式
2014-12-20 16:18
176 查看
理解观察者模式
简单的讲,一个对象作为特定任务或是另一对象的活动的观察者,并且在这个任务或活动发生时,利用事件的形式通知观察者。观察者的使用场合
当一个对象的改变需要同时改变其它对象,并且它不知道具体有多少对象需要改变的时候,就应该考虑使用观察者模式。例如,用户A,B,C分别订阅某服务,当服务有更新是可设定更新、下载等操作。
模拟实现
定义Observable对象,其内部包含了2个方法:add(订阅)与fire(发布)方法// 观察者 var Observable = { callbacks: [], add: function(fn) { this.callbacks.push(fn); }, fire: function() { this.callbacks.forEach(function(fn) { fn(); }) } }
订阅
Observable.add(function() { console.log(1); }) Observable.add(function() { console.log(2); })
发布
Observable.fire(); // 1, 2
实际应用
实际业务中,如请求某个ajax后需要执行多个方法,数据处理、渲染页面、其他业务等,可以使用观察者Observable.add(function() { //pocessData }) Observable.add(function() { $('test').html(data.a) $('test2').html(data.b) $('test3').html(data.c) }) Observable.add(function() { //pocessOther }) $.ajax({ url: "test.html", context: document.body }).done(function(data) { Observable.fire(data) })
相关文章推荐
- 设计模式学习笔记--Observer Pattern观察者模式
- 步步为营 .NET 设计模式学习笔记 十二、Observer (观察者模式)
- 设计模式学习笔记(二)之观察者模式(Observer)
- javascript学习笔记(九) js对象 设计模式
- 大话设计模式之观察者模式--学习笔记
- Head First 设计模式学习笔记(2)--观察者模式
- 学习笔记 ---- 设计模式之观察者模式
- 设计模式学习笔记(二)之观察者模式(Observer)
- 学习笔记 ---- 设计模式之观察者模式
- js 设计模式学习--观察者模式
- HeadFirst 设计模式学习笔记2--观察者模式
- 大话设计模式之观察者模式--学习笔记
- 《Head.First设计模式》的学习笔记(3)--观察者模式
- 设计模式C++学习笔记之十六(Observer观察者模式)
- 设计模式学习笔记(二)之观察者模式(Observer)
- 学习笔记----------observer观察者模式
- java 设计模式学习笔记(12) - 观察者模式
- 步步为营 .NET 设计模式学习笔记 十二、Observer (观察者模式)
- 设计模式C++学习笔记之十六(Observer观察者模式)
- 设计模式学习笔记(二)之观察者模式(Observer)