What is the purpose of this? (function ($) { //function code here })(jQuery);
我正在调试其他人的JavaScript代码,大部分代码都包含如下:
1 2 3
| (function ($) {
//majority of code here...
})(jQuery); |
($)和(jQuery)发生了什么? 我没有被教过这样的代码,也没有见过它们。 他们的目的是什么?
同样,没有document.ready,但我认为这是因为代码在结束时被();读取后立即执行?
-
该代码将在document.ready上执行
-
@longbkit:不,那不是DOM就绪代码。
-
@longbkit,不,这不是它的意思。 请继续阅读关闭......或者,地狱,开始学习javascript。
-
@Raynos为什么你不理解'这可能是一个NOOB问题'
-
@tsdexter它只是一个被调用的函数
-
从document.ready切换到(function($) {})(jQuery);为我修复了类似的问题。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
| var $ ="some value we don't care about";
// v=====normal plain old function
(function ($) {
// ^=======receives jQuery object as the $ parameter
//majority of code here, where $ === jQuery...
$('.myclass').do().crazy().things();
})(jQuery);
// ^=======immediately invoked, and passed the jQuery object
// out here, $ is undisturbed
alert( $ ); //"some value we don't care about" |
-
好的,所以基本上这样做的全部意义在于你可以在该函数内部用$()表示法调用jQuery,如果像prototype这样的东西使用$()表示法并不重要,那么在函数之外?...所以实际上它只是让你不必在每次使用没有冲突时编写jQuery()(或其他一些表示法)..这是有道理的
-
基本上,majority of code here ...位中的所有内容都与代码的其余部分隔离开来。它存在于不同的范围内。如果在那里创建var something = 1,它不会以全局window范围结束。此结构外部的代码无法覆盖内部的任何内容。
-
@tsdexter:是的,你已经知道了。全局jQuery由本地$引用,这意味着全局$(如果有)可用于其他目的。在JavaScript中,使用函数创建变量范围。
-
谢谢,我会再接受一分钟。
-
对于记录,这些被称为IIFE - 立即调用函数表达式。 :)
-
@davidchambers:是的,这是一个比仍然流行的"自我调用函数"更好的描述,它不能正确描述正在发生的事情。
当您需要/需要使用jQuery.noConflict()时,这非常有用,并且全局名称$不是jQuery的别名。您发布的代码允许您在匿名函数中使用较短的$表示jQuery,而$不需要是全局的。
-
谢谢,虽然RightSaidFred打败了你。非常感激。
-
+1提及jQuery.noConflict,这使得jQuery放弃全局$。
只是为了扩展RightSaidFred的答案,当我第一次看到()()语法时,我有点迷惑,但是一旦我意识到括号被用来定义一个匿名函数然后调用它就有意义了。例如:
1
| (function (msg){alert(msg)})('hello'); |
...定义一个函数,然后调用它,将'hello'作为参数传递。
所以问题中的例子:
1 2 3
| (function ($) {
//majority of code here...
})(jQuery); |
将jQuery传递给一个匿名函数并在函数中将其称为$,这是一种保证$将适用于jQuery而不会干扰其他任何东西的方法。
这种结构称为JQuery插件,插件的目的是在项目中创建任何常见任务/功能的框架,同样可以根据您在不同页面或同一页面中的使用情况扩展插件。这样你可以避免在任何地方重复相同的代码。
看看http://docs.jquery.com/Plugins/Authoring
-
该结构不仅仅是jQuery构造。虽然它可以在创建插件时使用,但它不需要。 jQuery插件是通过扩展jQuery.prototype创建的。