javascript anonymous function [duplicate]

This question already has answers here: Closed 11 years ago.

Possible Duplicate:

What does this JavaScript snippet mea开发者_运维问答n?

i was wondering why is the double Bracket in the end of the function?

here is simple of the anonymous function :

(function(){ ... })();

(function(){ ... })();

what those for?

---

This declares an anonymous function and invokes it immediately on the same line. Think of it as:

foo();

where foo represents an anonymous function which is declared inline and cannot be referenced by a name.

---

It's a self executing function. Meaning it is excuted immediately.

function anon() {
    alert('called');
}
anon(); // alerts at this time

(function () {
    alert('called');
})(); // alerts at this time, calls itself

---

Your code sample

(function(){ ... })();

can be rewritten as

anonymous = function () { ... };
(anonymous)();

or, avoiding the redundant first brace pair, as

anonymous = function () { ... };
anonymous();

at the cost of introducing a name into the (here global) name space.

As pointed out by pst earlier, this construction is used to create a new scope. It is most useful in combination with closures, for example to implement the ubiquitous counter:

 var counter = function (initval) {
   var c = initval || 0;
   return function () {
    var r = c;
    c += 1;
    return r;
   };
} (5);

counter () ; // 5
counter () ; // 6
counter () ; // 7

---

function e(){} // function statement, parsed before runtime, can't be anonymous

var e = function (){}; // function expression, parsed at runtime

(function(){}()}); // function expression (evaluated at runtime by the enclosing "()")

So, in order to call it, just call the result of the above expression and et voila! You got your self an anonymous self-executing function.

---

It declares and calls/executes the function.

---

Consider function foo (){ ... }

If you just had that, it wouldn't do anything. In order to call foo you need the parameter list (albeit null). So foo() would execute.

The same thing applies to an anonymous function. However, if you have an anonymous function, like function (){ ... }, how do you call it? You have no variable pointing to it. Without the end () it is just a definition, and not a call, so you must add the parens at the end, only you can't do function (){ ... }() because of order-of-operation and how JavaScript is interpreted. Thus you also need to surround the definition in its own parentheses (function (){...}). With the call it would look as you posted (function (){...})().

Note you can also define functions similarly, like:

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

Which essentially is creating an anonymous function and assigning it to a variable. You can then do foo() like you would with any other function.

---

In the form expression (...), () is the function-application operator. It takes in the expression on the left, which must be a function-object and invokes it, passing in the supplied parameters, if any. (The other use of () is for precedence, which includes (expression-that-evaluates-to-a-function-object).)

The "trick" is to understand this works for any expression that evaluates to a function-object and that a function-name simply evaluates to the function-object it represents. Here is a demonstration:

function f1 () { return 1 }
typeof f1     // function
f1()          // 1
var f1b = f1  // f1 evaluates to a function-object which is assigned to f1b
f1b()         // 1
var f2 = function () { return 2 }
typeof f2     // function
(((f2))())    // 2 -- only one of the sets is the application operator
typeof (function () {})       // function
(function () { return 3 })()  // 3 -- any function-object can be applied

Happy coding.

---

One reason for using a self-invoking anonymous function is to "create a new scope". New scopes in JavaScript are only introduced by new functions.