1

in the last few days i'm interesting in anonymous function in javascript , so i started to "explore" frameworks such as jquery , in the very first line i saw this piece of code :

var jQuery = (function() { .. functions .. }();

and a question came in mind - what is the purpose of that code? why a variable contain anonymous function? what is the uses with that var? is it kind of function container or something? if it is how to access the functions?

homerun
  • 19,837
  • 15
  • 45
  • 70
  • Not really sure what you want to know. It is assigning the *return value* of the immediate function to `jQuery`. Most of the time you have this to isolate variables (scope). Immediate functions don't have to be anonymous btw. – Felix Kling Oct 16 '11 at 15:46
  • *related*: http://stackoverflow.com/questions/4806150/javascript-function-vs-function – Felix Kling Oct 16 '11 at 15:47
  • It's called the module pattern. It's used to create a namespace. – Šime Vidas Oct 16 '11 at 15:48
  • You might want to [read this](http://www.crockford.com/javascript/private.html). – Pointy Oct 16 '11 at 15:51
  • Recommended read: http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth – Šime Vidas Oct 16 '11 at 16:03

2 Answers2

3

what is the purpose of that code?

You are actually missing a closing parenthesis for this code to be valid javascript:

var jQuery = (function() { ... })();

It defines an anonymous function and executes it immediately storing the result of it in the variable.

You can think of it like this:

var jQuery = foo();

It's just that they didn't bother to define foo as an external function as they didn't need to call it elsewhere in the code. So they defined it as an anonymous function.

By doing this everything that is declared inside this anonymous function is scoped and accessible only to the containing anonymous function. It is not accessible to the outside.

Darin Dimitrov
  • 1,023,142
  • 271
  • 3,287
  • 2,928
  • 1
    Explain him the namespace pollution problem :-) – xanatos Oct 16 '11 at 15:47
  • in case i have only functions inside this anonymous function , how to access those functions? – homerun Oct 16 '11 at 15:48
  • @MorSela, where do you want to access them? Normally everything that is inside this anonymous function is not accessible to the outside. It's scoped only inside this anonymous function. – Darin Dimitrov Oct 16 '11 at 15:49
  • @Mor Sela you cannot access the functions inside the anonymous function unless it returns a value that explicitly exposes them. – Pointy Oct 16 '11 at 15:50
  • 1
    @Mor You assign them as properties to an object which you then return from the anonymous function. – Šime Vidas Oct 16 '11 at 15:51
  • in case i want to return something , and storing it into the contain variable , how i do that? just the normal return command in the end of the anonymous function? – homerun Oct 16 '11 at 15:53
  • @MorSela, you could return complex objects from this anonymous function using the `return` statement. Those complex objects could contain properties and even other functions. Those functions could then be executed on the resulting variable: `jQuery.someFunction()`. – Darin Dimitrov Oct 16 '11 at 15:54
0

By reducing scope for all contents of the function, you prevent possible collisions in the global scope, accidental hoisting, and minimize the additional attached objects to the window object.

ledlogic
  • 774
  • 1
  • 9
  • 19