Why are parentheses used to carry javascript function calls?

Question

What is the difference between these two javascript function calls?

(function(){alert("foo")})() 

in comparison with this:

 (function(){alert("foo")}()) 

Answer 1

This is done for readability.

There is not a real functional difference between the two examples you provided, but both are very close to a simple function declaration, which is different. Brackets are added for readability to distinguish them.

Here is what each of your snippets does:

In the first of two fragments, the first bracket will be evaluated as the value of the closed function. Then this value will be called as a function. Thus, in the end, the function will be executed, which is probably of interest to you.

In your second snippet, the outer bracket will be evaluated as containing the function declared in the line and executed immediately. Again, the function will be executed, which is likely to be what you care about.

Both of them will perform the same function, so there will be no significant difference.

The difference between a snippet like yours and a simple function declaration:

The functions you specified are also identical to the following. I just added a function name and assigned a return value for syntactic precision that you can ignore for now.

 // javascript... var val = function myFooFunc () { alert("foo"); }(); 

However, this would be easily mistaken for a simple declaration of a function that is different:

 // javascript... function myFooFunc () { alert("foo"); } 

Note that the only real difference here is that this last function declaration is not executed immediately. Rest. Thus, this is a completely different behavior (a simple declaration can be executed later if it is called by name or cannot be executed at all). It is often difficult to see this difference in syntax right away, especially if the body of the function grows very long and requires scrolling on the screen.

Why are functions performed immediately?

When a function is immediately executed after its declaration, the value often returns to something (this may be part of the assignment statement). Sometimes a function is executed immediately because it contains internal functions and is used to provide a functional area for closed statements.

In fact, people close the brackets around the form “right away” (both of your snippets and the first of my two) to give a visual hint to other developers that the function is being called immediately. It's just easier to read, since you can't catch the brackets until you get to the end of the function (or notice them at all).

Answer 2

They have the same behavior.

The brackets encapsulating the function declaration tell the JavaScript engine to execute the code immediately after it is parsed. In the first example, you create a function object and then call it with parentheses. In the second example, you tell the JavaScript engine to create a function object and call it immediately.

Example:

 // creates a function object var f1 = (function() { alert('foo'); }); // creates a function object and executes it immediately var f2 = (function() { alert('foo'); }()); 

The difference is that f1 gives you a function object. f2 creates and calls an anonymous function.