自调用函数jQuery [重复]答案

【问题标题】：Self-invoking function jQuery [duplicate]自调用函数jQuery [重复]
【发布时间】：2013-06-26 12:14:26
【问题描述】：

我注意到在某些地方，jQuery 代码被包装在一个自调用函数中，如下所示。为什么要这样做，这在什么情况下有用，在什么情况下是不必要的样板？

function( $ ) {
  ...
}( jQuery );

【问题讨论】：

您不需要$ 全局变量来表示jQuery，这方面有很多重复项和资源。
函数创建变量范围。你的函数现在有一个作用域$。就是这样。
...但是如果您的代码放在.ready() 处理程序中，这是不必要的，因为您可以只执行jQuery(document).ready(function($) {...}); 或更短的jQuery(function($) {...});

【解决方案1】：

简短回答：防止变量名冲突。并非总是需要，但这是创建无冲突可重用代码的良好实践。

长答案：在 javascript 中，$ 符号只是另一个变量。 jQuery 使用它是因为它是一个很好的速记，而不是每次都必须输入 jQuery，但任何其他代码（包括其他库）也可以。

为了防止与同一范围内的变量的其他用途发生冲突（在本例中为“全局”范围内的 $），通常将代码包装在具有“无冲突”变量的自调用函数中作为函数参数传递。然后，这会创建一个新范围，您的变量不会干扰该变量的其他用途。这样你就可以传递完整的命名变量并在匿名函数中使用你想要的任何名称。

因此，在创建无冲突的可重用代码时，最好使用以下方法：

(function( $ ) {
  ...
})( jQuery );

沿着这些线，您还将看到以下格式：

(function( $, window, undefined ) {
  ...
})( jQuery, window );

在这种情况下，undefined 仅用于提高可读性以指示不再向函数传递参数。

【讨论】：

【解决方案2】：

如果您想避免在使用 $ 时发生冲突

function( $ ) {
  ...
}( jQuery );

您可以在此函数内部使用$，而不必担心它在函数外部的使用，因为$ 始终引用jQuery 对象。

这在创建 jQuery 插件时很有帮助，你会看到 jQuery 插件使用这种功能来避免与其他插件的冲突。

【讨论】：

【解决方案3】：

在函数范围内$ 是局部变量，不与任何其他全局$ 冲突。

【讨论】：