概述
实现订阅发布模式的基本思路:
- 订阅者把自己想订阅的事件注册到调度中心,所以第一步应该先实现订阅者到调度中心的方法。(订阅方法)
- 调度中心统一调度订阅者注册到调度中心的处理代码。(发布方法)
- 订阅者取消订阅事件(取消订阅方法)
直接附上代码:
var Pubsub = {
on: function (evt, fn, ctx) {
this.subscribe(evt, fn, ctx, false);
},
one: function(evt, fn, ctx) {
this.subscribe(evt, fn, ctx, true);
},
off: function (evt, fn) {
if (this.channels[evt] === undefined) { return; }
var i, l;
for (i = 0, l = this.channels[evt].length; i < l; i++) {
var sub = this.channels[evt][i].fn;
if (sub === fn) {
this.channels[evt].splice(i, 1);
break;
}
}
},
subscribe: function (evt, fn, ctx, once) {
if (this.channels === undefined) {
this.channels = {};
}
this.channels[evt] = this.channels[evt] || [];
this.channels[evt].push({fn: fn, ctx: ctx, once: (once || false)});
},
trigger: function (evt) {
if (this.channels && this.channels.hasOwnProperty(evt)) {
var args = Array.prototype.slice.call(arguments, 1);
var evtSubscribers = [];
var evtSubscribersForExec = [];
while(this.channels[evt].length > 0) {
var sub = this.channels[evt].shift();
if ( !sub.once ){
evtSubscribers.push(sub);
}
if (typeof (sub.fn) === 'function') {
evtSubscribersForExec.push(sub);
}
}
this.channels[evt] = evtSubscribers;
while(evtSubscribersForExec.length > 0) {
var eventSub = evtSubscribersForExec.shift();
eventSub.fn.apply(eventSub.ctx, args);
}
}
}
};
例子:
function handler () {
console.log(this.name)
}
function handler2 () {
console.log(this.name)
}
var p1 = new Object();
p1.name = '小张';
var p2 = new Object();
p2.name = '小王';
Pubsub.on('p1', handler, p1);
Pubsub.on('p2', handler, p1);
Pubsub.on('p1', handler2, p2);
Pubsub.on('p2', handler2, p2);
Pubsub.trigger('p1') // 小张 小王
最后
以上就是执着毛巾为你收集整理的订阅发布模式 - 事件的全部内容,希望文章能够帮你解决订阅发布模式 - 事件所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复