jQuery和Twitter Bootstrap函数说明
如果您看到所有文档中都存在twitter的bootstrap application.js文件,您会注意到以下代码:
!function( $ ) { ... }( window.jQuery );
有人可以解释为什么这是第一行代码的情况?
谢谢
这是一个自我执行的function:
!function(x){}(y)
x
是函数的参数, y
是在该函数的自动调用中传递的参数。
!
只是一个视觉指南,一目了然地告诉你该function是自动执行的。 另一种常见做法是将其包裹在括号中。 (function(){}())
那是因为
function($) {} (window.jQuery);
在语法中无效,但是
!function($) {} (window.jQuery);
已validation。
现在的问题是为什么第一个案例无效?
我们先来看看这个。 匿名函数和命名函数都可以被视为表达式 ,例如
0 + function(y) { return y; } (1); 0 + function x(y) { return y; } (1);
都是有效的。
然后考虑这种情况,这个语句包含一个表达式
function x(y) { return y; } (1);
“那不对!” 你可以这么说吗,因为你知道它们实际上是一个函数定义和一个带有一个表达式的语句(1)
。
事实是,这些代码对于语法分析器来说是不明确的,因为它可以被解析为一个函数和一个括号包装的表达式,或者函数调用。 为了避免这种模糊,Javascript规定如果function
作为语句的第一个标记出现,则该语句应该是一个函数定义 。 所以function($) {} (window.jQuery);
在语法中无效,因为它不是有效的函数定义。 但是假装一个!
甚至这种代码是有效的
0 + function x(y) { return y; } (1);
它是一个带有二进制加号的语句,其中rhs是函数调用。
这保证了在函数内部的代码中,您将能够使用$ quickhand方式访问jQuery。 在某些环境(例如Wordpress)中,他们没有“启用”$简写以避免与其他JavaScript库冲突。 通过这种方式,您可以在任何环境中使用简单的$构造(只要定义了window.jQuery)。
所以,基本上它创建一个函数并立即调用它,传入window.jQuery。 这意味着函数中的代码将看到$ local变量,并且它已被赋值为window.jQuery。