I get confused when I see examples of self invoked anonymous functions in Javascript such as this:
(function () { return val;}) ();
Is there a difference between this syntax and the following:
function() { return val;} ();
If someone can give me a concrete difference, it would help put to rest a question that's been bugging me for ages...
Javascript doesn't have a block scope, so this is a way to create a temporary local scope that doesn't pollute the global namespace. The parentheses serve two purposes:
see here: http://peter.michaux.ca/articles/an-important-pair-of-parens
In Safari 4, the following code (without the parentheses) results in "SyntaxError: Parse error":
function() { alert("Test"); }();
...but the following code works as expected:
(function() { alert("Test"); })();
Update: I also tried the code in Firefox 3 (via Firebug), and it behaved just like Safari.
The reason
function() { return val;} ();
doesn't work is because it's a function statement, not an expression. It's a pretty minor distinction, but basically, if the statement starts with function
, it's just like a C function declaration, and you can't call the function, because there is no expression value.
Adding the parentheses makes the function definition part of an expression, so it has a value and can be called.
Assigning the return value of the function also eliminates the need for parentheses, because the function definition is not the whole statement. For example, these work:
var value = function() { alert("works"); return 0; }();
(function() { alert("works"); })();
but this doesn't:
function() { alert("doesn't work"); }();
I always include the parentheses, even when they aren't necessary because it makes it easier to see that I'm calling the function, instead of assigning it to a variable.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With