5

Possible Duplicate:
Difference between (function(){})(); and function(){}();
Are “(function ( ) { } ) ( )” and “(function ( ) { } ( ) )” functionally equal in JavaScript?

I just wondered whether there is a difference (regarding the functionality) between these two examples:

1st

(function foo() {
console.log("bar")
})()

2nd

(function foo() {
console.log("bar")
}())

Both seem to work fine ...

Thanks!

Community
  • 1
  • 1
LSFR77
  • 61
  • 1
  • 4

3 Answers3

10

No difference. In fact, you need to use () only because plain...

function() { console.log('bar'); } ();

... won't be properly recognized by JS parser. As said in the ES5 standard:

Also, an ExpressionStatement cannot start with the function keyword because that might make it ambiguous with a FunctionDeclaration.

The alternative (to (...)) solution is augmenting this statement with some unary operator. Both...

+function() { console.log('bar'); } ();

... and ...

!function() { console.log('bar'); } ();

... will work.

raina77ow
  • 103,633
  • 15
  • 192
  • 229
4

They are exactly the same. There is no difference whatsoever between the two in terms of efficiency, output, or use. Using either one is a matter of preference.

Though there is a shorter variation of the two forms commonly used by JS minfiers. That is, logical NOT-ing the function expression and calling it:

!function() {
    console.log( x );
}();​
David G
  • 94,763
  • 41
  • 167
  • 253
2

There's no difference between them. Both are immediately invoked function expressions. Some people like Douglas Crockford prefer the second method. Some prefer the first. Interestingly Crockford's JSLint doesn't allow the first method, so I assume that the second one is more common.

Oh, and if you use a function declaration instead of a function expression then you can call the function before it appears in the program. This is because declarations are hoisted in JavaScript:

greet(); // This will work

function greet() {
    alert("Merry Christmas!");
}

The same is not true for function expressions:

greet(); // This will not work

var greet = function greet() {
    alert("Merry Christmas!");
};

That's pretty much all you need to know for now.

Aadit M Shah
  • 72,912
  • 30
  • 168
  • 299
  • `function greet()`, though valid, doesn't make sense. Just `var greet = function ()` is all that's needed. – ErikE Dec 27 '12 at 02:43
  • @ErikE - Doesn't make sense as in? It makes perfect sense to me. – Aadit M Shah Dec 27 '12 at 09:26
  • What is the point of a name that cannot be used? It makes as much sense as `function () { var greet; }` if greet is never used. – ErikE Dec 27 '12 at 09:40
  • @ErikE - The name is used. See for yourself: http://jsfiddle.net/HhpH4/1/ – Aadit M Shah Dec 27 '12 at 09:50
  • 2
    I'm sorry, I was unclear. `var greet = function greet () {}` is what I was talking about. [See what I mean](http://jsfiddle.net/HhpH4/2/). It is useless to give a function a name on the right hand side of an expression. – ErikE Dec 27 '12 at 10:38
  • 1
    @ErikE - Well that's because named function names are local variables. You can only access them from the function itself. However a function declaration name can be accessed from the containing scope and since declarations are hoisted you can call the function before the definition. – Aadit M Shah Dec 27 '12 at 13:43
  • @ErikE, not completely. `var wish = function greet(){}; alert(wish.name);` will produce "greet" – Brian S Apr 24 '16 at 09:50
  • @BrianS I know that and consider it so minor as to be immaterial. I have never seen in production code any practical use for the `.name` property of a named function. – ErikE Apr 24 '16 at 15:03
  • @ErikE, Tracking the call stack in a sandboxed JS environment? More something for "development" use than "production" use, but the use is there. https://github.com/shdwjk/TheAaronSheet/blob/master/TheAaronSheet.js#L288 – Brian S Apr 24 '16 at 15:17
  • @BrianS if you need to do that, then yes, name your functions! – ErikE Apr 24 '16 at 15:21
  • @BrianS I always name my functions for the sake of debugging, unless I'm 100% certain that the function expression will never throw an error. Also, I prefer using function declarations over function expressions. I prefer writing `function greet() {}` over `var greet = function () {}` for three reasons. First, I can move my function definitions to the bottom (usually past the last return statement). That way my code is cleaner. Second, named functions aid in debugging. Third, function declarations are usually faster than function expressions. – Aadit M Shah Apr 24 '16 at 17:01