又被称为发布订阅模式,或者消息机制。定义了一种依赖关系,解决了主体对象和观察者之间功能的耦合
其实他就是定义了一种一对多的关系,让多个观察者对象同时监听某一个主体对象,这个主体对象的状态发生变化时,就会通知所有的观察者对象,使得他们能够自动更新自己。
观察者对象的好处:
- 支持简单的广播通信,自动通知所有已经订阅过的对象。
- 页面载入后目标对象很容易与观察者存在一种动态关联,增加了灵活性。
- 目标对象与观察者之间的抽象耦合关系能够单独扩展以及重用。
js 通过对观察者模式的实现是通过回调函数的方式
我们来先定义一个 pubsub 对象,其内部包含了 3 个方法:订阅、退订、发布
// 创建一个观察者
var Observe = (function() {
var _message = {};
return {
register: function(type, fn) {
//注册信息接口
if (typeof _message[type] === 'undefined') {
_message[type] = [fn];
} else {
_message[type].push(fn);
}
},
fire: function(type, args) {
//发布消息接口
if (!_message[type]) return;
//消息信息
var event = {
type: type,
args: args || {}
},
i = 0,
len = _message[type].length;
for (; i < len; i++) {
//一次执行注册过的方法
_message[type][i].call(this, event);
}
},
remove: function(type, fn) {
//移除消息接口
if (_message[type] instanceof Array) {
var i = _message[type].length - 1;
for (; i > -0; i--) {
_message[type][i] === fn && _message[type].splice(i, 1);
}
}
}
};
})();
Observe.register('test', function(e) {
console.log(e.type, e.args.msg);
});
Observe.register('test', function(e) {
console.log(e.type, 'Liusixin');
});
Observe.fire('test', {
msg: 'test test'
});