Javascript 关闭回调函数不同于原来的打开回调函数

Javascript 关闭回调函数不同于原来的打开回调函数,javascript,html,css,Javascript,Html,Css,首先,我不是在使用jquery,而是在构建自己的香草javascript库。下面是我的off函数,然后是我的events包装函数,看看我是如何制作off函数的,然后看看我的events函数。我所做的是创建我自己的“off”回调函数,它不同于我的“on”回调函数,所以在删除我的事件侦听器时,我可以有一个退出回调函数。我所做的有意义吗?公开讨论 off: function(event, selector, callback, capture) { if (typeof (selector) =

首先,我不是在使用jquery,而是在构建自己的香草javascript库。下面是我的off函数,然后是我的events包装函数,看看我是如何制作off函数的,然后看看我的events函数。我所做的是创建我自己的“off”回调函数,它不同于我的“on”回调函数,所以在删除我的事件侦听器时,我可以有一个退出回调函数。我所做的有意义吗?公开讨论

off: function(event, selector, callback, capture) {

  if (typeof (selector) === 'function') {
    capture = callback;
    callback = selector || null;
  }

  selector = typeof selector == 'string' ? selector : null;
  capture = capture ? true : false;

  if(selector) {
    let obj = $(selector, this.$el);

    if(obj.$elems.length) {

      obj.$elems.forEach(function(el, i) {
        evts.remove(event, el, callback, capture);
      });

    } else if(obj.$el){        
      evts.remove(event, obj.$el, callback, capture);
    }

    return this;
  }


  if(this.$elems && this.$elems.length) {
    this.$elems.forEach(function(el, i) {
      evts.remove(event, el, callback, capture);
    });
  } else {
    evts.remove(event, this.$el, callback, capture);
  }

  return this;
}
事件包装器

var evts = (function () {
  'use strict';

  var listeners = [],
      add,
      remove;

  add = function (evt, elem, fn, capture) {
    var callback = function (evt) {      
      fn.call(elem, evt, evt && evt.target ? evt.target : window.event.srcElement);
    };

    listeners.push({
      evt: evt,
      elem: elem,
      fn: fn,
      callback: callback,
      capture, capture,
      removed: false
    });

    elem.addEventListener(evt, callback, capture);
  };

  remove = function (evt, elem, fn, capture) {

    var callback = function (evt) {
      return fn ? fn.call(elem, evt, evt && evt.target ? evt.target : window.event.srcElement) : null;
    };

    listeners.forEach(function (obj, i) {
      if (obj.evt === evt && obj.elem === elem && 
          !obj.removed) {
        obj.removed = true;

        if(callback && callback !== obj.callback) {
          callback();
        }

        callback = obj.callback;
        listeners.splice(i, 1);

        return false;
      }
    });

    elem.removeEventListener(evt, callback, capture);
  };

  return {
    add: add,
    remove: remove
  };
}());
例如:

$('#btn').on('click', function(e) {
    $(this).off('click', function(e) { alert('good bye') });
});

我认为你对工程有点过分了。这些重载真的被使用了吗?另外,我也不太明白退出回调的原因。我认为你太过工程化了。这些重载真的被使用了吗?另外,我并没有真正了解关闭回调的原因。