Question

I am quite new to JavaScript and just started some more serious development in JavaScript. I had a lot of fun implementing the Module pattern. One thing that really drove me crazy was the behavior of the ‘return’ statement. It is a big difference if you write

Test = ( function()
{
    var message = "Hello World!";

    return
    {
        // Does not work
        printTest: function() { window.alert(message); }
    };
}());

or

Test = ( function()
{
    var message = "Hello World!";

    return {
        // Works well
        printTest: function() { window.alert(message); }
    };
}());

Note the curly brace after the ‘return’ statement.

Is that a typical stupid rookie error and is well documented somewhere?

Firebug was not able to give a hint. IE9 and Chrome did report some obscure syntax error at a later location in the code: the opening brace after the ‘function‘ statement in “printTest: function()“.

Any comments on this? Are there more such pitfalls in JavaScript?

Answer 1

If you put your brackets to the next line, the interpreter assumes that there is a semi-colon.

So your return statement will be interpreted as:

return; 
{
   printTest: function() { window.alert(message); };
}

If I remember well, i’ve red about this problem in JavaScript: The Good Parts

A.3. Semicolon Insertion

JavaScript has a mechanism that tries to correct faulty programs by automatically inserting semicolons. Do
not depend on this. It can mask more serious errors.
It sometimes inserts semicolons in places where they are not welcome. Consider the consequences of
semicolon insertion on the return statement. If a return statement returns a value, that value expression
must begin on the same line as the return:

return
{
   status: true
};

This appears to return an object containing a status member. Unfortunately, semicolon insertion turns it
into a statement that returns undefined. There is no warning that semicolon insertion caused the
misinterpretation of the program. The problem can be avoided if the { is placed at the end of the previous line
and not at the beginning of the next line:

return {
   status: true
};

“JavaScript: The Good Parts by Douglas Crockford. Copyright 2008 Yahoo! Inc.,
978-0-596-51774-8.”