3

Please explain the following way of writing a function in javascript functions :

(function (){
 // some code 
})()

I understand the fact that because of the trailing braces " () ", the function will execute immediately but but what does enclosing the function in the braces mean?

AakashM
  • 62,551
  • 17
  • 151
  • 186
aditya_gaur
  • 3,209
  • 6
  • 32
  • 43
  • 4
    The second is a syntax error: a function declaration must include a name. – RobG Jun 14 '11 at 08:22
  • thanks for the comment I have rephrased the question – aditya_gaur Jun 14 '11 at 08:28
  • 1
    possible duplicate of [What does this mean? (function (x,y)){...}){a,b); in JavaScript](http://stackoverflow.com/questions/3921922/what-does-this-mean-function-x-y-a-b-in-javascript) – Andy E Jun 14 '11 at 08:30
  • 1
    possible duplicate of [What does this JavaScript/jQuery syntax mean?](http://stackoverflow.com/questions/2309614/what-does-this-javascript-jquery-syntax-mean) – James Wiseman Jun 14 '11 at 08:33

3 Answers3

4

As RobG pointed out, this is the only valid statement choice in your original question.

(function (){
 // some code 
}())

This is executed right after it is parsed, and provides a way to out-scope the code inside the function from the rest of your code. This is called a closure (see Closures on MDN) and may help with memory leaks in your scripts.

Codesleuth
  • 10,321
  • 8
  • 51
  • 71
4

Your syntax is incorrect. Edit: fixed.

Look at a normal function definition that you want to call once and only once:

function add(x,y) {
   var z = x + y; 
   // do something with z
}

add(2,3);

You could reduce this code so that you execute it straight away, there is no need to name it add:

(function(x ,y) {
   var z = x + y; 
   // do something with z
})(2,3)

Note how we have surrounded the function with a set of parenthesis to make it a callable expression. This pattern is often used to create a closure (capture the state of) certain variables, for example:

jQuery.noConflict(); //Disables the use of $ in the global scope
(function($) {

   //Safely use $ inside this function
   $('.link').click(function(e) {
      //etc
   });

})(jQuery);
James Westgate
  • 11,306
  • 8
  • 61
  • 68
1

Enclosing the code in a grouping operator changes it from a function declaration to a function expression (where the name is optional and usually omitted). That pattern is often called an "immediately invoked function expression" (iife) or "immediately executed function expression" (iefe).

It is used to replace a function declaration that is called just once. It is also fundamental to the module pattern.

RobG
  • 142,382
  • 31
  • 172
  • 209