关于jquery闭包的一个简单问题

时间:2010-01-08 01:31:46

标签: javascript jquery mootools

这是什么意思?

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

使问题更清楚,在括号中包含函数的含义在JS中是什么意思(抱歉,我对闭包的概念有点困惑)。 $参数怎么样?和最后括号中的“jQuery”?

我可以用mootools做同样的事情并将它们合并到1个JS文件中吗?

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

(function($){})(mooTools);

我只与jquery合作,并计划与Mootools合作

6 个答案:

答案 0 :(得分:24)

在括号之间包装函数可确保将此函数计算为函数表达式

这是因为Grouping Operator(括号)只能评估表达式

如果没有使用括号,它将被解释为函数声明,它将导致语法错误,因为函数声明的函数名是可选

(function(arg){
  alert(arg); // alerts test
})("test");

在上面的例子中,函数表达式自动执行,传递一个参数。

jQuery插件大量使用该模式,因为jQuery可以在 noConflict 模式下运行,不会创建$全局变量,因此jQuery全局对象作为参数传递这个匿名函数,在该函数内部,您可以自由地将其称为$(收到的参数)。

请记住,与上面示例一样调用的自执行函数表达式中的函数上下文(this关键字)也将始终引用Global对象。

有关函数表达式和函数声明之间差异的更深入信息,请查看以下资源:

答案 1 :(得分:6)

CMS给了你正确的答案,但我只想补充一点,这不是一个闭包。这只是用于返回表达式结果的()运算符,在本例中是一个函数表达式,并且在javascript中,可以直接调用返回的匿名函数。所以这只是两者结合:

var x = (1+1); // <-- () evaluates an expression

var arr = [0,1,2];
arr.push(function(text){alert(text)});
arr[3]('hello'); // <-- function returned by array called directly

至于$参数,这只是javascript允许变量名称的一个字符。您的示例完全等同于:

(function(jQ){})(jQuery);
(function(moo){})(mooTools);

答案 2 :(得分:5)

这样做的要点是,在函数表达式中创建的对象可以从附加到传入对象的属性和方法中使用,而不公开公开这些对象。这有助于防止可变碰撞。它还允许创建的变量作为附加任何内容的私有存储进行访问..

(function($){
//jQuery is available here as $
var myPrivateArray = []; //this is private
$.addItem = function(item) { myPrivateArray.push(item); }
})(jQuery);

//I can't access myPrivateArray here... //but I can use jQuery.addItem to add something.

答案 3 :(得分:1)

以下是关于闭包的文章:http://www.jibbering.com/faq/faq_notes/closures.html

基本上,正如CMS所说,它是一个函数表达式。有一个完美的例子可以帮助您更好地理解该页面的2/3。

最后一组括号中的jQuery表示您将jQuery对象传递给内部函数。该内部函数获取对象,并将其指定为$。因此,当您访问函数内部的$时,您实际上正在对您传递的jQuery对象进行操作。

至于将它们与jQuery和Mootools混合,我从未使用过Mootools,所以我不确定它是如何分配的。我唯一想到的是,如果它使用$之类的jQuery,你可以调用jQuery.noConflict();并将jQuery重新分配给另一个变量,也许是var $j = jQuery;然后,你可以像往常那样使用Mootools

答案 4 :(得分:0)

function($) { ... }创建一个接受名为$的参数的函数。

括号括起来什么也没做。

添加(jQuery)会将jQuery作为参数调用该函数。


这样做是为了使函数在全局范围内独立于$ 当您在函数中编写$时,您指的是参数 $,而不是全局变量$

答案 5 :(得分:0)

命名空间$的mootools是:

(function($) {
    // $ is the mootools one (aliasing document.id)
})(document.id);

你可以将它们组合成一个文件,但请记住,mootools是一个原型框架,$仅用于选择器的目的,而所有函数都进入元素/数组/类等原型。因此在mootools中这样做:

var foo = $("bar");
foo.hide(); // the element inherits .hide()

但在jquery中它会失败并需要转录为

var foo = $("#bar");
$(foo).hide();

重点是,你不能将mootools导出的东西命名为原型。