变量作为eventListener命名函数表达式的名称

Variable as eventListener named function expression name

本文关键字:函数 表达式 eventListener 变量      更新时间:2023-09-26

我正在编写一个很棒的IIFE,并希望它对使用它的用户来说尽可能简单。所以我在想,由于他们中的一些人不知道要在事件监听器不是函数的情况下轻松删除它我们可以给这个内联函数起一个名字

document.addEventListener('click',function dood(){
    //some function
},false);
document.removeEventListener('click',dood,false);
//instead of 
function dood(){
  //some function
} 
document.addEventListener('click',dood,false);
document.removeEventListener('click',dood,false);

但是既然他们不应该知道确切的名字,我想知道我们是否可以

var k = "name_of_function";
document.addEventListener('click',function window[k](){
  //the function
},false);

虽然我知道这不起作用,有办法做到这一点吗?我想让他们更容易做到这一点

object.cancel('name_of_function') //which will be the name of the instance
// they created earlier if they gave that instance a name
object={
  cancel:function(nm){
    document.removeEventListener(self.trigger,window[nm],false);
    //self.trigger really is this.trigger which they assign as either scroll,click,mousemove,etc.
  }
};

任何想法?还是说这根本不可能?

用法是:

scrollex('element',{
    max:500,
    min:500,
    pin:200,
    offset:0.5,
    name:'google',//this then would be used in multiple instances
});
scrollex.events //shows all events and their names
scrollex.listen('google'); //it'll console log all info for this event
scrollex.cancel('google');

我认为你的思路是对的。但是您不应该使用window,而是使用一些本地对象。动态命名函数表达式(或者不管function window[k](){}是什么意思)是不可能的是一种痛苦-不要尝试。让它们保持匿名,并且只通过属性名/变量引用它们。

var object = (function() {
    var listeners = {
        name_of_function: function dood(){…}
    };
    document.addEventListener('click', listeners.name_of_function, false);
    return {
        cancel: function(nm) {
            document.removeEventListener('click', listeners[nm], false);
        }
    };
}());
// now, you can
object.cancel('name_of_function')