-2

Noob Question

I was going through the ES6 features website and I found this piece of code

function f (x, y, z) {
    if (y === undefined)
        y = 7;
    if (z === undefined)
        z = 42;
    return x + y + z;
};
alert(f(1))

When I don't pass the y ans z params to the function,in line 4 if (z === undefined) is true. What I don't understand is, how does the compiler know that only line 5 is part of the if block and not return statements.

In other words, how does the compiler know to execute it in this way

if (z === undefined) {
    z = 42;
}
return x + y + z;

and not in this way

if (z === undefined) {
    z = 42;
    return x + y + z;
}

How does the compiler know that the return statement is not a part of the second if statement?

glennsl
  • 28,186
  • 12
  • 57
  • 75
Brr Switch
  • 974
  • 1
  • 9
  • 21
  • Please suggest an appropriate title to the question if it doesn't sound right – Brr Switch Sep 21 '17 at 16:26
  • An `if` statement without (curly) brackets will only evaluate the single next expression, the calculation and return statements are 2 expressions, hence only the calculation is linked with the `if`. This is why you should always use curly brackets – Nick is tired Sep 21 '17 at 16:27
  • an if block without braces will only consider the next line to be the block of code to execute. I'm pretty sure this is a basic syntax rule in any language that allows an if body to not be surrounded by braces. The ambiguity is also why I hate not surrounding an if body in braces. – chiliNUT Sep 21 '17 at 16:27
  • *"I was going through the ES6 features website and I found this piece of code"* Kinda wonder about the quality, if that's an accurate quote, as it uses a `;` where one *isn't* needed (after a function declaration) and leaves off one where it *is* needed (after a call statement), forcing the JavaScript engine to apply error-correction in the form of automatic semicolon insertion. – T.J. Crowder Sep 21 '17 at 16:32
  • This is explained perfectly well in the [documentation for the `if` statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else). –  Sep 21 '17 at 16:37
  • Thank you everyone! not sure why it is downvoted though. I was just trying to clear out a confusion – Brr Switch Sep 21 '17 at 16:40

2 Answers2

4

If you omit the braces, only the single statement following the condition is run. z = 42; is the single statement following the condition, so it's the only one that's run.

If you need to run more than one statement, wrap them in a block.

It should be noted though that this is not specific to ES6, or even Javascript for that matter. Most notable languages that make use of if-statements and blocks follow this "rule".

It should also be noted that omitting braces is usually a bad idea, unless you have a good reason and use case for it. It often leads to scenarios when code is assumed to be a part of a block, when it really isn't. Even Apple was bitten by this bad habit.

Carcigenicate
  • 43,494
  • 9
  • 68
  • 117
  • It should also be noted that relying on this "feature" is usually considered bad form, since it's so easy to add a statement and forget to wrap them in a block. – glennsl Sep 21 '17 at 16:30
  • Please note that this is not an ES6 syntactic thing but has been like that since always. The same is true for other languages with C-styled syntax i.e Java, C# – gpanagopoulos Sep 21 '17 at 16:34
0

It is known concept from most of languages where you can write code in this way. It means that if you don't have braces after if/while etc., only the first statement is executed. Otherwise, everything in braces. It may lead to misunderstanding in your code so use braces even if there is only one statement (maybe in future will be two or more there, good practice).

glennsl
  • 28,186
  • 12
  • 57
  • 75
Artur Czopek
  • 292
  • 1
  • 9