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

时间:2014-06-05 04:37:00

标签: javascript variables event-listener

我正在编写一个非常棒的IIFE,并希望这对于使用它的用户来说尽可能简单。所以我在想,因为他们中的一些人不知道如果没有它已经是一个函数就可以轻松删除一个eventlistener我们可以给内联函数一个名字

示例

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');

1 个答案:

答案 0 :(得分:1)

我认为你走在正确的轨道上。但是你不应该使用window和一些本地对象。并动态命名函数表达式(或function window[k](){}应该表示的任何意思)不可能 a pain - 不要试试这个。只是让他们保持匿名,只通过属性名称/变量引用它们。

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')