使用参数添加和删除事件监听器

我正在写一个普通 JavaScript工具，启用后将事件侦听器添加到传递给它的每个元素。

我想做这样的事情：

var do_something = function (obj) {
        // do something
    };

for (var i = 0; i < arr.length; i++) {
    arr[i].el.addEventListener('click', do_something(arr[i]));
}

不幸的是，这不起作用，因为据我所知，添加事件监听器时，参数只能传入匿名函数:

for (var i = 0; i < arr.length; i++) {
    arr[i].el.addEventListener('click', function (arr[i]) {
        // do something
    });
}

问题是我需要能够在禁用该工具时删除事件侦听器，但我认为不可能使用匿名函数删除事件侦听器.

for (var i = 0; i < arr.length; i++) {
    arr[i].el.removeEventListener('click', do_something);
}

我知道我可以轻松地使用 jQuery 来解决我的问题，但我正在努力最小化依赖性。jQuery 必须以某种方式解决这个问题，但代码有点混乱！

这是无效的：

arr[i].el.addEventListener('click', do_something(arr[i]));

监听器必须是一个函数参考。当您调用函数作为参数时addEventListener，函数的返回值将被视为事件处理程序。您不能在侦听器分配时指定参数。处理函数将始终被调用event作为第一个参数传递。要传递其他参数，您可以将处理程序包装到匿名事件侦听器函数中，如下所示：

elem.addEventListener('click', function(event) {
  do_something( ... )
}

为了能够通过删除removeEventListener您只需命名处理函数：

function myListener(event) {
  do_something( ... );
}

elem.addEventListener('click', myListener);

// ...

elem.removeEventListener('click', myListener);

要访问处理函数中的其他变量，可以使用闭包。例如。：

function someFunc() {
  var a = 1,
      b = 2;

  function myListener(event) {
    do_something(a, b);
  }
  
  elem.addEventListener('click', myListener);
}