Question

如果我有这个：

$(SomeID).on({
    click: function () { SomeFunction1(); },
    mouseenter: function () { SomeFunction2(); },
    mouseleave:function () { SomeFunction3(); }
}, '.SomeClass');

我可以将其重写为

$(SomeID).on({
    click: SomeFunction1,
    mouseenter: SomeFunction2,
    mouseleave: SomeFunction3
}, '.SomeClass');

但是，如果我需要传递一些这样的参数：

$(SomeID).on({
    click: function () { SomeFunction1($(this)); },
    mouseenter: function () { SomeFunction2($(this).index()); },
    mouseleave: function () { SomeFunction3($(this).index()); }
}, '.SomeClass');

有替代方案吗？

感谢。

Answer 1

正如@Jashwant所说，无论如何都会在函数中使用相同的this，因此它是您不必担心的一个值（在您的示例中）。

请注意，您可以按照自己的描述进行操作，对静态值很容易，并且称为currying。一个javascript示例是：http://www.dustindiaz.com/javascript-curry/

Answer 2

你应该修改SomeFunction的实现，让它们在没有参数的情况下工作。

例如，如果你有：

function SomeFunction2(arg) {
  //do something assuming arg to be $(this).index()
}

你可以这样写：

function SomeFunction2() {
  var arg = $(this).index();
  //do exactly the same
}

对所有三个回调执行此操作后，您可以使用第二个代码示例来绑定它们。

Answer 3

javascript函数中this的含义不依赖于函数定义的词法范围 - 例如，以下警告“Hello，World！”，如果this.name不是在创建greet时定义

var x = { name: 'World' };
var greet = function() { alert('Hello, ' + this.name); };
x.greet = greet;
x.greet();

以下也警告“Hello，World！”：

var x = { name: 'World' };
var y = { name: 'Dude', greet: function() { alert('Hello, ' + this.name); } };
x.greet = y.greet;
x.greet();

在幕后，发生的事情类似于：

var greet = function() { alert('Hello, ' + this.name); };
greet.call({ name: 'World' });

因此，您可以安全地混合＃2和＃3片段。

<强>顺便说一句：

大多数jQuery事件处理程序都是通过引用jQuery事件对象作为第一个参数来调用的，所以如果你发现this的工作方式很棘手（或者如果你担心你必须向你们每个人解释一下）同事），您也可以使用event.delegateTarget代替this。

参见例如：

$(document).click(function(evt){ alert (evt.delegateTarget === this); });

javascript传递函数作为参数

3 个答案: