为什么在jQuery中调用函数需要包装在方法中?

假设我有一个function:

function myFunction() { ... } 

我想从事件处理程序中调用它。 为什么这种结构不能调用我的function?

 $(window).resize(myFunction()); 

但这就是诀窍:

 $(window).resize(function(){myFunction()}); 

这些类型的通话有什么区别?

 $(window).resize(myFunction()); 

立即调用 myFunction并传递返回值resize 。 在函数名称/引用之后添加括号将调用该函数。

另一方面,

 $(window).resize(function(){myFunction()}); 

传递一个匿名函数resizemyFunction仅在调用外部函数时调用。

匿名函数没什么特别之处。 在这种情况下,它只是某种内联函数定义 。 您可以使用函数参考轻松替换它:

 var handler = function(){myFunction()}; // take out the function definition $(window).resize(handler); // and replace it with the new name 

现在您可以看到函数名后面没有括号,这意味着,不调用handler ,只传递引用。

我希望你现在也可以看到在这个例子中创建一个新函数是没有必要的。 您可以通过简单地传递对myFunction的引用来实现相同的目的:

 $(window).resize(myFunction); 

但两种方式都有其用例。

第一个例子$(window).resize(myFunction()); 如果myFunction 返回一个应该用作事件处理程序的函数 ,它仍然有用:

 function myFunction() { var handler = function() {}; return handler; } 

也许重新调整的处理程序取决于传递给myFunction的参数。

如果要使用某些特定参数调用myFunction ,则必须传递匿名函数:

 function myFunction(a, b) { alert(a + b); } $(window).resize(function(){ myFunction(40, 2); }); 

更新:

@TJ Crowder对event对象做了重要评论。 每个事件处理程序都将事件对象作为第一个参数传递。 如果你将你的function定义为

 function myFunction(event) { ... } 

要使用匿名函数(更容易)访问它,您必须通过它:

 $(window).resize(function(event){myFunction(event)}); 

如果你想使用它。