关于javascript:为什么有些人写一个像$(函数($)的函数

why some people write a function like $(function( $ )

我知道像$(function( $ )这样的代码没有任何意义,但我在各个地方都找到了这种代码,包括todomvc。

编写像jQuery(function( $ )这样的函数来解决任何其他库使用的$的潜在冲突,而不是$function($)


没有理由使用

1
$(function($))...

如果您在行的开头使用美元符号,那么它依赖于它是一个jQuery对象,所以如果您稍后将jQuery对象作为参数传递以避免冲突,为什么不在第一个地方使用它?现在太晚了......

使用它的正确方法是:

1
2
3
4
5
6
(function($){ // The dollar variable is a parameter.
   $(function(){ // You use the $ variable only inside the function.
   });
})(jQuery); // jQuery is passed as a parameter.

$.somePrototypeFunctionHere(); // Here the dollar variable can be something else.


这毫无用处

这个表格根本没用:

1
2
$(function($) {
});

只有在没有其他库可以覆盖$(例如原型)时,它才会起作用。

它是如何有用的

由于jQuery将自身作为DOM ready事件处理函数的第一个参数传递,因此您可以充分利用它:

1
2
3
4
jQuery(function($) {
    // this === document
    // $ === jQuery
});

也可以在源代码中找到此行为的证据:

1
readyList.resolveWith( document, [ jQuery ] );

它将this映射到document,并将ready函数的第一个参数映射到jQuery。代码看起来有点不明显的原因是因为ready事件是使用Deferred处理的。

相当于

有点等同的符号是这样的:

1
2
3
4
(function($) {
  $(function() {
  }
}(jQuery));

如果你在ready处理程序之外做更多的事情,这将是首选,这实际上比你想象的更频繁。


有许多方法可以在DOM准备好时为DOM初始化jQuery脚本。流行的方法是:

1
$(document).ready(function(){});

同样的简写是:

1
$(function(){});

更新#1:$()jQuery()战斗!

由于提出jQuery$的原因,原因是大多数库使用$作为访问库中函数的较短方式。说,MooTools和Prototype JS。因此,为避免冲突,他们可能会将$替换为jQuery

jQuery有一个名为jQuery.noConflict();的函数,它放弃了jQuery对$变量的控制,使$不能与jQuery一起工作。希望这能解决你的问题。

在Prototype.JS文档中,$符号返回文档中具有匹配ID的元素;否则返回传递的元素。

此外,$功能是Prototype的基石。它不仅为document.getElementById提供了方便的别名,还允许您将无差别的ID(字符串)或DOM节点引用传递给您的函数。

更新#2:关于$的问题作为参数...

没有人使用:

1
$(function($){})

它是

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

要么

1
$(function(){});

请检查。 :)


是的,因为您可能知道原型也使用$所以这里jQuery变得很好,这允许我们使用jQuery,即使$被其他一些lib保留。

检查一下

将jQuery与其他库一起使用


1
$(function( $ )

是简写

1
$(document).ready(function() {

并且你是对的:Jquery(function( $ )用于与jquery和其他js库可能发生冲突的情况


$(function(){})的大多数人都是因为他们是用户而这样做。即他们选择使用jquery而不是任何冲突的库。因此使用它是安全的。


你的问题不明确。传递jQuery对象使其本地作用域(据我所知,对模块)。它用作性能增强。

1
2
3
(function($) {
  // Code in here
})(jQuery);

从ready()| jQuery的

别名jQuery命名空间

使用其他JavaScript库时,我们可能希望调用$.noConflict()以避免名称空间困难。调用此函数时,$快捷方式不再可用,每次正常写入$时强制我们写jQuery。但是,传递给.ready()方法的处理程序可以接受一个参数,该参数传递给全局jQuery对象。这意味着我们可以在.ready()处理程序的上下文中重命名对象,而不会影响其他代码:

1
2
3
jQuery(document).ready(function($) {
  // Code using $ as usual goes here.
});

这是指定DOM完全加载时要执行的函数的其他方法。它可以在jQuery中以三种方式完成 -

以下所有三种语法都是等效的:

1
2
3
4
5
jQuery(document).ready(function($){})

jQuery().ready(function($){}) //(this is not recommended)

jQuery(function($){})

解决冲突的另一种方法是 -

1
(function($) { /* some code that uses $ */ })(jQuery)

你可能想读这个。


1
2
3
$(function() {
  // Do your code here...
});

确保完整下载文档和脚本。

1
2
3
(function($){
  // Do your code here...
})(jQuery);

允许在函数中使用$符号而不与其他库冲突,这给了$符号不同的含义。

所以你可以同时使用上述两个。

1
2
3
4
5
(function($){
   $(function() {
      // Do your code here...
   });
})(jQuery);


这是解决$的任何潜在冲突的更好方法:

1
2
3
4
5
(function($){
   $(function(){
      // all the code stuff here....
   });
})(jQuery);

你的编辑:
My question is actually misunderstood by many giving answers. I want to know about the dollar as an argument in the function.

这只是为了保护$符号,这是jQuery的简写,还有许多其他库也使用$符号,所以经常有机会遇到麻烦。

从文档中读到:

it's a best practice to pass jQuery to an IIFE (Immediately Invoked Function Expression) that maps it to the dollar sign so it can't be overwritten by another library in the scope of its execution.

1
2
3
(function($) {
     // all other things    
})(jQuery);

Now within that closure, we can use the dollar sign in place of jQuery as much as we like.

更多这里阅读