Strange JavaScript syntax like this: (function(){//code}) ();?

Question

What does the below JavaScript mean? Why is the function embedded inside ()?

(function() {
    var b = 3;
    a += b;
}) ();

Answer 1

Functions in javascript are objects and can be used as objects too. So for example you can do this:

var a = function() {alert("done");};
a();

This is commonly used in various functions where you have to pass some logic inside. For example the "sort" function for arrays expects a function object to be passed inside to determine how to sort the array:

var a = [{id: 15, name: 'test'},
         {id: 11, name: 'asd'},
         {id: 88, name: 'qweqwe'}];
a.sort(function(a,b) {
    if (a.id > b.id) return 1; //Put a after b
    if (a.id < b.id) return -1; //Put a before b
    if (a.id == b.id) return 0; //Don't make no changes
});

The 'sort' method then invokes the provided function with all kinds of array elements to sort it.

What your example does - it creates a function object and just instantly runs it.

Answer 2

This are anonymous function which is executed in place.The best usage of this is to set some context or environment settings or have some side effect on load.

This are heavily used by Ajax Toolkits like JQuery,Dojo,etc to performs load time magic and workaround many browser quirks and shortcomings.

Answer 3

It's functionaly equivalent to doing something like:

var myFunc = function(){
    var b = 3;
    a += b;
};

myFunc();

It's got the parenthesis around it (and trailing) so that the function is called immediately. As others have said, the concept is called an anonymous function.

Answer 4

This is an anonymous functions, which fires just after its creation.

Answer 5

What you wrote is an anonymous function called immediately. The reason for doing that is use of private variables. If instead of your code there would be:

var b = 3;
a += b;

b will be global variable. So if you need in global code private variable, that is the way to do this.

Answer 6

Justin's answer explains it pretty well, but I thought I'd just add that the first set of parentheses (the opening one before function) is actually completely unnecessary as far as program execution is concerned. For readability, however, it's very important! When I see this:

(function() {

I know that this function is being called immediately, without having to scroll down to find the end of the block. This is important because sometimes you want to assign the return value of the function to a variable, and sometimes you want to assign the function to a variable. See:

var x = (function() {
    return 4;
})();

var y = function() {
    return 4;
};

// typeof x == integer (4)
// typeof y == function