您的位置:首页 > Web前端 > JavaScript

(四)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)
})
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: