JavaScript/jQuery闭包函数语法

Question

有人可以解释以下功能之间的差异:

(function($){
  // can do something like 
  $.fn.function_name = function(x){};

})(jQuery);

我可以在下一个函数中使用jQuery吗？

(function(){

}());

以下是与jquery.ready()相同的内容吗？

$(function(){

});

谢谢!

Answer 1

(function($){
  // can do something like 
  $.fn.function_name = function(x){};

})(jQuery);

这是$在参数中使用的自执行匿名函数,因此您可以使用它($而不是jQuery在函数内部)而不必担心与其他库冲突,因为在其他库中也$具有特殊含义.在编写jQuery插件时,该模式特别有用.

你可以在那里写任何角色而不是$:

(function(j){
  // can do something like 
  j.fn.function_name = function(x){};

})(jQuery);

这里j将自动赶上最后指定的jQuery (jQuery).或者你可以完全忽略参数,但是你必须使用jQuery关键字而不是$不用担心碰撞.所以$包含在简短的参数中,以便你可以在该函数内部$而不是jQuery全部写入.

(function(){

}());

这是自动执行的匿名函数,但没有参数,并且因为()最终而自行运行/调用.

在某些情况下,这种模式非常有用.例如,假设你想在每次500毫秒后运行一段代码,你自然会去setInterval.

setInterval(doStuff, 500);

但是,如果doStuff功能需要超过500毫秒才能完成它的工作呢？你会看到意想不到的结果,但setInterval不管是否doStuff完成,都会在指定时间一次又一次地调用该功能.

这就是该模式的用武之地,你可以setTimeout结合自动执行的匿名函数做同样的事情,并避免这样的坏事 setInterval:

(function foo(){
   doStuff;

   setTimeout(foo, 500);

})()

此代码也会一次又一次地重复,但有一点不同.setTimeout除非doStuff完成,否则永远不会被触发.比使用坏的方法好得多setInterval.

请注意,您还可以编写自执行匿名函数,如下所示:

function(){
  // some code
}();

使用额外的括号(比如之前的function关键字)只是编码约定,可以在Crackford的着作,jQuery和其他地方看到.

$(function(){

});

这是就绪处理程序的简写语法:

$(document).ready(function(){

});

更多信息:

另请注意,`jQuery(someFunction)`将jQuery对象作为回调的第一个参数传递.这允许你做一个稍微安全但仍然简洁的文档就绪处理程序版本:`jQuery(function($){...在这里使用$而不用担心全局冲突......}); (2认同)

Answer 2

我知道这个问题已经过时了,但我现在偶然发现它,其他人也是如此.我只是想指出的是,虽然Sarfraz的答案是伟大的,但必须说,没有,写一个自动执行的,匿名函数括号内是不是一个编码约定.

function(){
  // some code
}();

将无法工作并发出一个SyntaxError因为函数被解析为a FunctionDeclaration,并且在这种情况下函数名称不是可选的.

另一方面,分组操作员确保将内容评估为a FunctionExpression.

请参阅: 解释JavaScript的封装匿名函数语法