javascript - 编写自定义 .on()/.bind() JavaScript 的最高效方式

Question

我写了很多小库和模块，通常这些库和模块有一些与之相关的事件。直到现在我一直在写这些(缩短了很多):

Library.prototype.on = function(event, callback){
  self = this;
  self.events[event] = callback;
}

然后用户会做一些事情，例如:

Library.on('foo',function(){
  console.log('bar');
});

是否有更好、更高效的方法来执行此操作，或者这是实现此操作的标准方法？我想要一个简单的 API，我可以将其放入任何 JS 项目中以支持此行为。

Answer 1

var EventEmitter = {
    constructor: function _constructor() {
        this._events = [];
        return this;
    },
    on: function _on(ev, handler) {
        if (!this._events[ev]) {
            this._events[ev] = [];
        }
        this._events[ev].push(handler);
    },
    removeListener: function _removeListener(ev, handler) {
        if (!this._events[ev]) return;
        this._events[ev].splice(this._events[ev].indexOf(handler), 1);
    },
    removeAll: function _removeAll(ev) {
        delete this._events[ev];
    },
    emit: function _emit(ev, data) {
        if (!this._events[ev]) return;
        this._events[ev].forEach(invokeHandler);

        function invokeHandler(handler) {
            handler(data);
        }
    }
};

我有一个小的 EventEmitter，当我需要快速而肮脏的自定义事件时，我会使用它。

我的实现与您的实现之间的唯一区别是我的实现允许每个事件有多个回调。

对于任何严肃的事情，我都会使用像 EventEmitter2 这样的事件库