1.源码缩影
!(function (name, definition) {
var hasDefine = typeof define === 'function', //检查上下文环境是否为AMD或CMD
hasExports = typeof module !== 'undefined' && module.exports; //检查上下文环境是否为Node
if (hasDefine) {
define(definition); //AMD环境或CMD环境
} else if (hasExports) {
module.exports = definition(require('debug')('eventproxy')); //构建为普通Node模块
} else {
this[name] = definition(); //构建在window.name中
}
})('EventProxy', function (debug) {
debug = debug || function () {}; //为debug设置默认值
var EventProxy = function () { //EventProxy构造函数
if (!(this instanceof EventProxy)) { //防止构造函数以call或apply方式被其它对象调用,只能new
return new EventProxy();
}
this._callbacks = {}; //new之后对象属性_callbacks,保存要处理的回调函数
this._fired = {}; //new之后对象属性_fired,保存回调之后的结果
};
EventProxy.prototype... //EventProxy的诸原型函数,所谓原型函数,就是这些函数为new之后对象多共享
EventProxy.create = function () {...}; //EventProxy的属性create,指向普通函数
EventProxy.EventProxy = EventProxy; //EventProxy的属性EventProxy指向自身
return EventProxy; //返回EventProxy构造函数
});
源码解读: 上面大致展示了eventproxy的结构,首先它使用闭包的形式保证了代码的整洁;其次为了适应不同的使用场合,代码中都做了必要的处理,而我们使用最多的无疑是作为nodejs的模块:检查exports,如果存在,则构建为nodejs模块:module.exports = definition(require(‘debug’)(‘eventproxy’));而definition则是function(debug)开始一直到文件结构的函数,其中debug作为调试,暂且不管,剩下的就是EventProxy函构造函数,EventProxy原型函数,EventProxy.create一般函数,最后返回EventProxy函构造函数.于是构建的结果相当于module.exports = EventProxy;所以在其它模块中的require(“eventproxy”)指向的就是EventProxy构造函数.
2.原型函数addListener,别名bind,on,subscribe
EventProxy.prototype.addListener = function (ev, callback) {
debug('Add listener for %s', ev);
this._callbacks[ev] = this._callbacks[ev] || [];
this._callbacks[ev].push(callback);
return this;
};
源码解读: 该方法接收两个参数:事件名称和回调函数,首先在_callbacks对象上面开辟事件的数组,之后把回调函数放进该数组中.
3.原型函数headbind
EventProxy.prototype.headbind = function (ev, callback) {
debug('Add listener for %s', ev);
this._callbacks[ev] = this._callbacks[ev] || [];
this._callbacks[ev].unshift(callback);
return this;
};
源码解读: 该方法与addListene方法相同,只不过是把回调函数放在了数组的第一个
4.原型函数removeListener,别名unbind
EventProxy.prototype.removeListener = function (eventName, callback) {
var calls = this._callbacks;
if (!eventName) {
debug('Remove all listeners');
this._callbacks = {};
} else {
if (!callback) {
debug('Remove all listeners of %s', eventName);
calls[eventName] = [];
} else {
var list = calls[eventName];
if (list) {
var l = list.length;
for (var i = 0; i < l; i++) {
if (callback === list[i]) {
debug('Remove a listener of %s', eventName);
list[i] = null;
}
}
}
}
}
return this;
};
源码解读: 该方法是为移除特定的回调函数:(1)两个参数都不存在,移除所有回调函数(2)eventName存在,callback不存在,移除eventName上的所有函数(3)eventName存在,callback存在,移除eventName上的callback函数.
5.原型函数removeAllListeners
EventProxy.prototype.removeAllListeners = function (event) {
return this.unbind(event);
};
源码解读: 该方法是为移除event上所有的函数.
6.原型函数bindForAll
EventProxy.prototype.bindForAll = function (callback) {
this.bind(ALL_EVENT, callback);
};
源码解读: 该方法是为绑定全局回调函数 __all__为callback
7.原型函数unbindForAll
EventProxy.prototype.unbindForAll = function (callback) {
this.unbind(ALL_EVENT, callback);
};
源码解读: 该方法是为移除全局回调函数__all__的callback函数
8.原型函数trigger,别名emit,fire
EventProxy.prototype.trigger = function (eventName, data) {
var list, ev, callback, args, i, l;
var both = 2;
var calls = this._callbacks;
debug('Emit event %s with data %j', eventName, data);
while (both--) { //执行两次,第一次执行eventName的回调函数,第二次执行全局__all__的回调函数
ev = both ? eventName : ALL_EVENT;
list = calls[ev]; //回调函数列表
if (list) {
for (i = 0, l = list.length; i < l; i++) {
if (!(callback = list[i])) { //如果回调函数不存在,移除
list.splice(i, 1);
i--;
l--;
} else {
args = both ? SLICE.call(arguments, 1) : arguments;
callback.apply(this, args); //非全局回调函数,值传入data,全局传入全部参数
}
}
}
}
return this;
};
源码解读: 该方法是为eventName事件触发函数,或对eventName事件注值函数:(1)事件触发会做两件事情,一是触发该事件的函数数组,把data出入一一执行,二是执行全局回调函数数组,把事件名称和data传进去,它内部会判断是否所有要处理的事件都已处理完毕,处理完毕就执行后面真正的全局回调,如果没有完成则会退出全局回调函数.
9.原型函数once
EventProxy.prototype.once = function (ev, callback) {
var self = this;
var wrapper = function () {
callback.apply(self, arguments); //回调wrapper时回调源回调函数,再解绑
self.unbind(ev, wrapper);
};
this.bind(ev, wrapper); //绑定的是wrapper,会回调wrapper
return this;
};
源码解读: 该方法是为一次性绑定函数,即回调之后会移除,是最常用的绑定函数,它绑定的不是原有回调函数,而是进行了包装,因为在包装内部要做解绑处理;虽然进行了包装,但是回调的时候传入的参数还是在内部传入远回调函数执行,只是多了一步解绑.
10.临时变量later
var later = typeof process !== 'undefined' && process.nextTick || function (fn) {
setTimeout(fn, 0);
};
源码解读: 存在process.nextTick,later就等于process.nextTick,没有就用setTimeout.
11.原型函数emitLater
EventProxy.prototype.emitLater = function () {
var self = this;
var args = arguments;
later(function () {
self.trigger.apply(self, args);
});
};
源码解读: 迟缓触发,参数应为eventName,data.
12.原型函数immediate,别名asap
EventProxy.prototype.immediate = function (ev, callback, data) {
this.bind(ev, callback);
this.trigger(ev, data);
return this;
};
源码解读: 即时的,绑定事件回调函数,触发
13.临时变量_assign
var _assign = function (eventname1, eventname2, cb, once) {
var proxy = this;
var argsLength = arguments.length; //参数个数
var times = 0; //已触发注值个数
var flag = {}; //已触发注值标志
// Check the arguments length.
if (argsLength < 3) { //参数小于3,返回
return this;
}
var events = SLICE.call(arguments, 0, -2); //取得传入的event数组
var callback = arguments[argsLength - 2]; //取得回调函数
var isOnce = arguments[argsLength - 1]; //取得是否一次调用标志
// Check the callback type.
if (typeof callback !== "function") { //没有回调函数,返回
return this;
}
debug('Assign listener for events %j, once is %s', events, !!isOnce);
var bind = function (key) { //为处理回调函数
var method = isOnce ? "once" : "bind"; //根据标志取得调用绑到的方法
proxy[method](key, function (data) { //绑定事件和回调函数,回调函数为内建,回调的时候会传入data参数
proxy._fired[key] = proxy._fired[key] || {}; //初始化结果保存位置
proxy._fired[key].data = data; //把数据注入_fired中
if (!flag[key]) { //没有回调过,标志置为true,事件回调个数+1
flag[key] = true;
times++;
}
});
};
var length = events.length;
for (var index = 0; index < length; index++) { //为每一个事件绑定回调函数
bind(events[index]);
}
var _all = function (event) { //全局回调函数
if (times < length) { //判断是否所有事件都已回调注值
return;
}
if (!flag[event]) { //判断传入的事件回调标志,无必要
return;
}
var data = [];
for (var index = 0; index < length; index++) {
data.push(proxy._fired[events[index]].data); //把所有注入的值放入到data中
}
if (isOnce) { //如果是一次绑定,解绑全局函数
proxy.unbindForAll(_all);
}
debug('Events %j all emited with data %j', events, data);
callback.apply(null, data); //回调用户传入的回调函数,把data出入,完成
};
proxy.bindForAll(_all); //绑定全局回调函数
};
源码解读: 及其重要,真正的assign函数,其会根据用户简单的事件数组,是否一次绑定标志,回调函数,为每一个事件绑定特定的回调函数,当执行这些回调函数的时候,会把触发的值注入,标志此事件回调完成,检查是否都已回调完成,如果是就调用全局回调函数,即把诸多事件注入的值整理出入用户传入的回调函数.
14.原型函数all,别名assign
EventProxy.prototype.all = function (eventname1, eventname2, callback) {
var args = CONCAT.apply([], arguments);
args.push(true);
_assign.apply(this, args);
return this;
};
源码解读: 一次绑定的_assign函数
15.原型函数fail
EventProxy.prototype.fail = function (callback) {
var that = this;
that.once('error', function (err) {
that.unbind();
callback.apply(null, arguments);
});
return this;
};
源码解读: 一次绑定error事件,触发的时候会解绑所有回调函数,把错误传入callback执行
16.原型函数tail,别名assignAll,assignAlways
EventProxy.prototype.tail = function () {
var args = CONCAT.apply([], arguments);
args.push(false);
_assign.apply(this, args);
return this;
};
源码解读: 永久绑定的_assign函数
17.原型函数after
EventProxy.prototype.after = function (eventName, times, callback) {
if (times === 0) { //容错吧,不太好
callback.call(null, []);
return this;
}
var proxy = this,
firedData = []; //用户自己注值的地方
this._after = this._after || {};
var group = eventName + '_group';
this._after[group] = { //注值的地方
index: 0,
results: []
};
debug('After emit %s times, event %s\'s listenner will execute', times, eventName);
var all = function (name, data) {
if (name === eventName) { //内部未实现,可能是让用户自己实现吧,逻辑简单?
times--;
firedData.push(data);
if (times < 1) {
debug('Event %s was emit %s, and execute the listenner', eventName, times);
proxy.unbindForAll(all);
callback.apply(null, [firedData]);
}
}
if (name === group) { //与原型函数group配合使用
times--; //注值一次,个数-1,感觉放在此处不妥
proxy._after[group].results[data.index] = data.result; //注值
if (times < 1) { //如果times=0,全部注值完成,解绑全局函数,把值传入callback执行
debug('Event %s was emit %s, and execute the listenner', eventName, times);
proxy.unbindForAll(all);
callback.call(null, proxy._after[group].results);
}
}
};
proxy.bindForAll(all); //绑定全局函数
return this;
};
源码解读: 此函数是为相同的事件的处理,好比多个文件的读取,次数就是文件的个数;内部没有为该事件绑定特殊的回调函数,而是永久性的绑定了一个全局函数,所以在每一次该事件的注入,即回调,都是执行的全局函数,二全局函数会执行一次,就注值一次,个数-1,直到个数为0就解绑全局,把所有注入的值出入回调函数执行.
18.原型函数group
EventProxy.prototype.group = function (eventName, callback) {
var that = this;
var group = eventName + '_group';
var index = that._after[group].index; //取出index,一个变量
that._after[group].index++;
return function (err, data) { //返回的是nodejs的回调函数,只不过帮用户处理了
if (err) {
// put all arguments to the error handler
return that.emit.apply(that, ['error'].concat(SLICE.call(arguments)));
}
that.emit(group, { //注值
index: index, //当前下标
//如果有callback,会返回经过callback处理的data,没有直接返回data
result: callback ? callback.apply(null, SLICE.call(arguments, 1)) : data
});
};
};
源码解读: 此函数为协助after的执行,源码说可以实现事件注入的有序,单我个人认为没有实现,它是类似这样的实现:
var ep = new EventProxy();
ep.after('file', files.length, function (list) {
// Ordered results
});
for (var i = 0; i < files.length; i++) {
fs.readFile(files[i], 'utf-8', ep.group('file'));
}
可是在下面文件注值的循环中也是异步处理的,实际注值的顺序是这些个文件读取完成的顺序,是不确定的;不确定的东西可以说是有序的么,有序是否应该是按照原文件列表的顺序呢,这种方式和name === eventName的处理是没有区别的.
19.原型函数any
EventProxy.prototype.any = function () {
var proxy = this,
callback = arguments[arguments.length - 1],
events = SLICE.call(arguments, 0, -1),
_eventName = events.join("_");
debug('Add listenner for Any of events %j emit', events);
proxy.once(_eventName, callback);
var _bind = function (key) {
proxy.bind(key, function (data) {
debug('One of events %j emited, execute the listenner');
proxy.trigger(_eventName, {"data": data, eventName: key});
});
};
for (var index = 0; index < events.length; index++) {
_bind(events[index]);
}
};
源码解读: 参数如:eventName1,eventName1,callback.它先一次绑定全局函数为callback,也为每一个事件绑定函数,内部会触发全局函数,进而实现任意一个事件触发,就回调.
20.原型函数not
EventProxy.prototype.not = function (eventName, callback) {
var proxy = this;
debug('Add listenner for not event %s', eventName);
proxy.bindForAll(function (name, data) {
if (name !== eventName) {
debug('listenner execute of event %s emit, but not event %s.', name, eventName);
callback(data);
}
});
};
源码解读: 内部绑定全局函数,如果触发的事件不是eventName,就执行回调.
21.原型函数done
EventProxy.prototype.done = function (handler, callback) {
var that = this;
return function (err, data) {
if (err) {
return that.emit.apply(that, ['error'].concat(SLICE.call(arguments)));
}
var args = SLICE.call(arguments, 1);
if (typeof handler === 'string') {
if (callback) {
return that.emit(handler, callback.apply(null, args));
} else {
return that.emit.apply(that, [handler].concat(args));
}
}
if (arguments.length <= 2) {
return handler(data);
}
handler.apply(null, args);
};
};
源码解读: 返回nodejs回调函数,帮用户处理一些错误信息而已:(1)handler是字符串,如果callback存在,则把callback处理的data触发handler事件,如果callback不存在,则直接data触发handler事件;(2)handler是函数,handler(data);(3)handler(arguments)
22.原型函数doneLater
EventProxy.prototype.doneLater = function (handler, callback) {
var _doneHandler = this.done(handler, callback);
return function (err, data) {
var args = arguments;
later(function () {
_doneHandler.apply(null, args);
});
};
};
源码解读: later + done
23.构造函数属性create
EventProxy.create = function () {
var ep = new EventProxy();
var args = CONCAT.apply([], arguments);
if (args.length) {
var errorHandler = args[args.length - 1];
var callback = args[args.length - 2];
if (typeof errorHandler === 'function' && typeof callback === 'function') {
args.pop();
ep.fail(errorHandler);
}
ep.assign.apply(ep, args);
}
return ep;
};
源码解读: assign的快捷方式,可以:EventProxy.create(eventName1,eventName2,callback,errorHandler),或者EventProxy.create(eventName1,eventName2,callback).fail(errorHandler)或者把前面的事件放在数组中.
总结:
eventproxy主要是为了解决在nodejs中异步调用深度嵌套的问题,在一定程度上也提高了效率,因为深度嵌套的回调是会产生依赖的,违反了nodejs异步的初衷. eventproxy的设计是基于这样一种场景,比如要在前端显示话题topic的信息,则在后台不但要拿到话题的信息,还要拿到其作者的信息,其所在栏目的信息,其回复的信息等,要拿到所有这些的信息,如果不采用深度嵌套调用的方式,是无法知道什么时候所有的异步都完成了. 基于这样一个场景,作者就想在一个地方存着这些回调的值,好比栏目信息取得了放进去,作者信息取了放进去,可是还是不知道什么时候都取过来了,于是需要检查,取进去一次值就检查一次. eventproxy中_fired就是存值的地方,形如_fired[eventName].data=data;_callbacks是存放回调函数的地方,回调函数是干什么用的,是存值用的.在用户说明了要在一块执行的一组事件后,eventproxy会问每个事件创建回调函数,其接受data参数,形如_callbacks[eventName] = [callback1,callback2];当用户取到某个事件的值时,就触发该事件,传入值,就完成了值的注入,每次注入会检查是否全部注入,全部注入会把全部的值处理为数组放入全局回调函数中回调,全局回调函数即是用户传入的callback.
博客链接地址:http://blog.csdn.net/qq976477610/article/details/24644031
