What is the difference in the following JS syntax?

javascript

Solution

The first is the return-value of the immediately-invoked function. The second is a function. It essentially comes down to what the difference is between these:

var f = (function() { return 0; })();

var f = function() { return 0; };

Since the first function is called immediately, the value of 0 is given to the variable `f`. The first `f` is not a function. However, the second `f` we must call in order to get the value:

f(); // 0

It follows that in your example, the first `BW.Timer` is the object literal itself and the second is a function returning an object literal. You must call the function in order to get to the object:

BW.Timer().Add(x);

Why use the first then?

You might ask yourself why one would use a syntax like `a = (function() { return {}; })()` instead of `a = {}`, but there's a good reason. An IIFE (Immeditately-Invoked Function Expression), unlike a regular function allows the emulation of static variables (variables that maintain their value through a single instance). For example:

var module = (function() {
    var x = 0;

    return {   get: function()  { return x },
               set: function(n) { x = n }
    };

})();

The above a text-book example of the Module Pattern. Since the function is called right away, the variable `x` is instantiated and the return value (the object) is given to `module`. There's no way we can get to `x` other than by using the `get` and `set` methods provided for us. Therefore, `x` is static, meaning its variable won't be overridden each time you use `module`.

module.set(5);

module.get(); // 5

On the other hand, let's see an example where `module` is declared as a function instead:

// assume module was made as a function

module().set(5);

module().get(); // 0

When we call `module()` the `x` variable is overridden each time. So we're effectively using different instances of `module` and `x` each time we call `module`.

Problem

Following are two ways to define BW.Timer. Can someone tell me what the difference is? I am not certain the first is even valid, but if it is valid, what is different about using the `myfunc=(function(){}())` syntax? ``` BW.Timer = (function () { return { Add: function (o) { alert(o); }, Remove: function (o) { alert(o); } }; } ()); ``` And... ``` BW.Timer = function () { return { Add: function (o) { alert(o); }, Remove: function (o) { alert(o); } }; }; ```

Original source