11

Possible Duplicate:
Difference between (function(){})(); and function(){}();

I am trying to understand a few of the features of JavaScript a little better. In The Definitive JavaScript it says that self-executing functions should have brackets round them like so:

var obj = (function() {
    var value = 0;

    return {
        increment: function(inc) {
            value += typeof inc === "number" ? inc : 1;
        },
        getValue: function() {
            return value;
        }
    }
})();

but in JavaScript - The Good Parts where this example is taken from, it has the above self-executing function without the brackets round, like so:

var obj = function() {
    var value = 0;

    return {
        increment: function(inc) {
            value += typeof inc === "number" ? inc : 1;
        },
        getValue: function() {
            return value;
        }
    }
}();

Both of these examples work for me, but I wanted to ask if there were any differences in functionality that I should be aware of. I hope this isn't too trivial. I just wanted to be sure.

Thanks a lot.

Edit:

As Rob W has pointed out, there is another thread on the subject. This is an excellent blog regarding this issue that was linked to from the other post.

Community
  • 1
  • 1
Joe
  • 4,852
  • 10
  • 63
  • 82
  • 4
    In this case, both are equivalent. When you omit `var obj = `, then the latter will throw an error. So, stick to #1, unless bytes become expensive. – Rob W Jun 18 '12 at 14:51
  • Great thanks Rob. Just interested to know: In what situations would I omit `var obj = `? This would return the object to the top level object wouldn't it? Cheers. – Joe Jun 18 '12 at 14:55
  • 1
    @Joe you would omit `var obj` if you want the function to run (i.e. you want its side effects) but it either returns no value, or you don't care what its return value is. – Alnitak Jun 18 '12 at 14:56

3 Answers3

13

There isn't any difference in this case, but only because it's prefixed with:

var obj = ...

Without that, only the first version is correct, because you need the additional parentheses to allow the interpreter to correctly parse the function as a function expression and not as a function declaration.

You would of course only omit var obj if you only want the function to run (i.e. you want its side effects) but it either returns no value, or you don't care what its return value is.

Alnitak
  • 334,560
  • 70
  • 407
  • 495
3

JavaScript: The Good Parts was written by Doug Crockford, who has updated his example to look like this:

var obj = (function() {
    var value = 0;

    return {
        increment: function(inc) {
            value += typeof inc === "number" ? inc : 1;
        },
        getValue: function() {
            return value;
        }
    };
}());

So the whole expression is within the brackets.

The idea of the outside brackets, which are not required, is that it makes it clear to developers that this is an intentionally self-executed function. So the value is readability.

Fenton
  • 241,084
  • 71
  • 387
  • 401
1

There aren't, in this example, any functional differences, but I do think the parentheses make it much more readable. How do you know how it is scoped without the parens? Is it hoisted? This is a brilliant thread on the subject.

ASIDE:

JSLint will complain that "function statements are not invocable. Wrap the whole function invocation in parens." I think most browser parsers not running in strict-mode would generally let it pass, but it's better not to rely on that.

Community
  • 1
  • 1
chrisfrancis27
  • 4,516
  • 1
  • 24
  • 32