JavaScript interpreter ignores syntax error

Question

This short snippet of code is obviously faulty:

if (5 > 2) {
  console.log("5 > 2");
} else (5 < 2) {
  console.log("5 < 2");
}

Condition for else should not be specified. Execution of this code will result in SyntaxError: Unexpected token {, as expected.

The problem is the fact that after a minor change (transferring the left brace to the new line), interpreter will simply ignore the syntax error.

This code:

if (5 > 2) {
  console.log("5 > 2");
} else (5 < 2)
{
  console.log("5 < 2");
}

results in this output (tested in chrome and firefox):

5 > 2
5 < 2

How is this possible? Why this else is not treated as a syntax error?

that looks about right. the second block { console.log("5 < 2"); } is not considered a part of the else at all ... and ( 5 < 2 ) while pointless is valid - it's like else { ( 5<2 ) } — Jaromanda X
– Jaromanda X, Commented Sep 24, 2016 at 7:29

DocMax · Accepted Answer · 2016-09-24 07:30:15Z

6

The difference is that in the second case, the carriage return makes the second braced block a standalone block rather than part of the else clause where the parenthetical part is the else clause. The second case is equivalent to:

if (5 > 2) {
    console.log("5 > 2");
} else {
    (5 < 2)
}

{
    console.log("5 < 2");
}

which is just:

if (5 > 2) {
    console.log("5 > 2");
} else {
    false
}

console.log("5 < 2");

answered Sep 24, 2016 at 7:30

DocMax

12.2k7 gold badges48 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

trincot · Accepted Answer · 2016-09-24 07:41:42Z

3

The reason for the different interpretation is the first of the ECMAScript Rules of Automatic Semicolon Insertion:

When, as the program is parsed from left to right, a token (called the offending token) is encountered that is not allowed by any production of the grammar, then a semicolon is automatically inserted before the offending token if one or more of the following conditions is true:

The offending token is separated from the previous token by at least one LineTerminator.

The offending token is }.

In your case, the offending token is {. In the first version of your code, neither of the bullet point conditions quoted above is true, so no semicolon is inserted, and a syntax error is raised.

In the second example of your code, there is a line terminator, as mentioned in the first condition. In that case a semicolon is inserted automatically so the parsed code really becomes this:

if (5 > 2) {
  console.log("5 > 2");
} else (5 < 2);
{
  console.log("5 < 2");
}

Now the code is valid as the opening brace that follows the semicolon is interpreted as the start of a code block that is not part of the expression that follows the else.

Note that even though this code now parses, it is clear that the expression in the else part has no effect.

answered Sep 24, 2016 at 7:41

trincot

357k38 gold badges282 silver badges338 bronze badges

2 Comments

Maciej Wiercioch Over a year ago

Thank you so much for such a fast and complete answer :) I was simply shocked when the code after automatic beautification resulted in different output.

trincot Over a year ago

You're welcome. "Automatic Comma Insertion" is indeed one of the less appreciated syntax rules of JavaScript.

qzb · Accepted Answer · 2016-09-24 07:36:40Z

3

It's all because Automatic Semicolon Insertion, when you transfer this brace to next line, JS engine "translates" your code to this:

if (5 > 2) {
  console.log("5 > 2");
} else (5 < 2);
{
  console.log("5 < 2");
}

Which is obviously correct, because JS allows placing stand-alone blocks.

answered Sep 24, 2016 at 7:36

qzb

9,1273 gold badges24 silver badges27 bronze badges

Collectives™ on Stack Overflow

JavaScript interpreter ignores syntax error

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related