Strange behavior of 'return' statement in JavaScript [duplicate]

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?

Answers:

Answer

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."

Answer

Are there more such pitfalls in JavaScript?

This made me smile :) Oh boy, you're in for a treat.

Have a look at this site for example: http://wtfjs.com/

Answer

Yes, it's a difference. I think it actaully is a part of documentation, the subject that is to be returned has to be in the same line as the return statement. It's beacause semicolons are optional, and the expression is interpreted as

return;
{
 ....
}
Answer

JavaScript does automatic semi-colon insertion. If you put the brackets on the next line after the return, the interpreter automatically inserts a semi-colon after the return, ending the statement.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.