I noticed in JQuery that the following code structure is used
(function(){var l=this,g,y=l.jQuery,p=l.$,...})()
Which seems to create a function, and call it.
What is the benefit of taking this approach versus having the contents of the function inline?
It creates a closure to prevent conflicts with other parts of code. See this:
- http://docs.jquery.com/Plugins/Authoring
Particularly handy if you have some other library that uses the $()
method and you have to retain the ability to use that with jQuery also. Then you can create a closure such as this:
(function($) {
// $() is available here
})(jQuery);
It creates a scope for variables, in particular defining $
for example to bind to jQuery
, no matter what other libraries overwrite it. Think of it as an anonymous namespace.
With self invoking anonymous function you create a local scope, it's very efficient and it directly calls itself.
You can read about it here
It's just like:
var foo = function(){var l=this,g,y=l.jQuery,p=l.$,...};
foo();
But more simple and do not need a global variable.
It allows to have local variables and operations inside of the function, instead of having to transform them to global ones.