Question

为什么这不能使用函数声明，但它使用函数表达式完美地工作？假设唯一的区别是浏览器如何将它们加载到执行上下文中。

function foo(event){
    console.log('in foo');
}

$('.btn').on('click',foo(event)); 

$.ajax({
    beforeSend:function(){
        $('btn').unbind('click');
    },
    success: function(){
        $('btn').bind('click', foo(event));
    }
});

使用函数表达式，效果很好：

var foo = function(event){
    console.log('in foo');
}

Answer 1

下面：

$('.btn').on('click',foo(event));

你没有传递“函数表达式”。你传递了调用函数“foo”的结果。这就是JavaScript语法的工作方式 - 如果您引用一个函数（通过名称或其他方式）并使用带括号的参数列表（可能为空），那么您将调用该函数。

下面：

var foo = function(event){
    console.log('in foo');
}

你创建一个函数，而不是传递它。请注意，在“foo”示例中，function关键字不存在。

如果要将函数“foo”作为事件处理程序传递，只需按名称引用它：

$('.btn').on('click', foo);

传递对函数“foo”的引用而不用调用它。 jQuery API将获取该函数引用并使用“foo”作为“click”事件的处理程序。

如果你需要在某个地方传递一个函数的引用（比如jQuery API），并且你希望用一些额外的参数调用这个函数，你有两个选择：

在函数原型上使用.bind()方法，或
自己在另一个功能中包装该功能。

对于jQuery事件处理程序，第三种选择是将对象作为.on()的参数提供。该对象将附加到事件实际发生时传递的event参数：

function foo(event) {
  var data = event.data;
  if (data.whatever) { // ...

然后，当您致电.on()时：

$('.btn').on('click', { whatever: true }, foo);

为什么我不能在JQuery的事件处理函数中将“函数声明”作为参数传递？

1 个答案: