Trouble Understanding Semicolon Insertion

According to this, JavaScript will insert a semicolon if: When the program contains a token that is not allowed by the formal grammar, then a semicolon is inserted if (a) there is

Solution 1:

The return statement problem you mention is not affected by that particular aspect of the semicolon insertion rule. Rather, it's this one:

When, as the program is parsed from left to right, a token is encountered that is allowed by some production of the grammar, but the production is a restricted production and the token would be the first token for a terminal or nonterminal immediately following the annotation ―[no LineTerminator here]‖ within the restricted production (and therefore such a token is called a restricted token), and the restricted token is separated from the previous token by at least one LineTerminator, then a semicolon is automatically inserted before the restricted token.

It so happens that the return statement syntax has one of those "[no LineTerminator here]" quirks.

See section 7.9.1 of the ES 5 spec.

Solution 2:

The rule is like this: if there is a new line, and we have a valid statement so far, then insert a semicolon.

In your first example this is valid:

return;  //  <--- semicolon inserted there
{
   id: 12
};

In the second example, this is invalid:

function foo() {
    var x = 1;
    {;             // *not a valid insertion*var y = 2; // yes, I know y has the same scope as x 
    }              // and that this is therefore pointless
    alert(y);
}

EDIT: This answer is not entirely correct! For example:

num = 4 + 5
  + 1;

// returns 10

See comments below:

Solution 3:

You're talking about keywords that are expecting blocks and keywords expecting expressions - return isn't like function or if, that are expecting a block ({ }) - so the parser is going to insert the semi-colon like other keywords not expecting braces.