0

在创建匿名 JavaScript 函数时将唯一属性关联到匿名 JavaScript 函数的标准方法是什么，以便在函数执行时（即运行时）可以在函数本身内访问这些属性？

一个场景是这样的：

假设我有想要绑定到动态生成的匿名函数的事件。

var events = ['connect','disconnect','error','connect_failed'];

for(a in events){
  var handler = function(){
     // console.log(arguments.callee.custom); // Not reliable 'cos callee is supposedly deprecated
     console.log('<event-name>');
  };
  handler.custom = events[a];
  $(window).on(events[a],handler);
}

由于不推荐使用arguments.callee，因此不能保证在所有平台上都是最佳的。实现类似目标的推荐方法是什么？

4

4 回答 4

2

你也可以handler.custom在你的函数中使用：

var handler = function() {
  console.log(handler.custom);
  console.log('<event-name>');
};

为了防止在异步回调的情况下出现范围问题，您可以handler通过将代码包装在闭包中来创建一个新的范围函数：

for(a in events){
  (function() {
    var handler = function(){
      console.log(handler.custom);
      console.log('<event-name>');
    };
    handler.custom = events[a];
    $(window).on(events[a],handler);
  })();
}

编辑：刚刚意识到您也可以使用forEach（尽管这也受到浏览器兼容性问题的影响）：

events.forEach(function(event) {
  var handler = function() {
    ...
  };
  handler.custom = event;
  $(window).on(event,handler);
});
于 2013-05-20T10:33:52.243 回答
1

命名函数表达式仅在函数范围内提供对函数本身的引用：

var events = ['connect', 'disconnect', 'error', 'connect_failed'];

for (var a in events) {
  var handler = function inside() {
     console.log(inside.custom); // not deprecated
     console.log('<event-name>');
  };
  handler.custom = events[a]; // now will stay with function even if renamed or moved
  $(window).on(events[a], handler);
}

但是，Internet Explorer 8 及更低版本将无法正确解析命名函数 - Juriy Zaytsev 更详细地解释了它们背后的确切问题：http: //kangax.github.io/nfe/#named-expr

如果你真的必须针对 IE8 及以下版本，要么坚持使用 arguments.callee，要么对 IE 使用条件编译，这基本上是 JavaScript 的 IE 条件注释。

于 2013-05-20T10:40:19.243 回答
0

我知道你的意思...当事件被触发时您想要事件名称，并且想知道在函数的运行时触发了哪个事件...我对吗？然后你可以使用处理程序中收到的事件对象... DEMO

var events = ['connect','disconnect','error','connect_failed'];

for(a in events){
  var handler = function(e){
     console.log(e.type); 
      console.log('<event-name>');
  };
  $(window).on(events[a],handler);
}

for(a in events){
  $(window).trigger(events[a]);
}
于 2013-05-20T10:47:46.360 回答
0

你可以这样做：

var events = ['connect','disconnect','error','connect_failed'];

function assignHandler(eventType, custom) {
   $(window).on(events[a], function() {
      console.log(custom);
   });
}   

for(a in events){
  assignHandler(events[a], events[a]);
}

JS 闭包的神奇之处在于，分配为内部事件处理程序的匿名函数assignHandler()将能够访问even aftercustom的参数。assignHandler() assignHandler()

但是，由于您似乎正在使用 jQuery 的.on()方法，因此您不需要自己实现任何东西，因为 jQuery 已经具有以下功能：

.on( events [, selector ] [, data ], handler(eventObject) )

注意可选的第三个参数是data. 在事件处理程序中，这可以作为event.data.

for(a in events){
  var handler = function(e){
     console.log(e.data);
     console.log('<event-name>');
  };
  var custom = events[a];
  $(window).on(events[a], null, custom, handler);
}
于 2013-05-20T10:52:20.397 回答