Javascript if statement-- no {} needed?

Question

I'm working thru a HTML5 projects course right now on Udemy.com and the guy's example code has this:

//Use a timer to call paint function
        if(typeof game_loop != "undefined") clearInterval(game_loop);
        game_loop = setInterval(paint, speed);

I thought 'if' statements had to have curly braces so the code inside can run if the the 'if' statment is true. Please advise. Thanks

Not needed as long as you only need 1 statement to execute but better to have them for readability — Huangism, Jul 10 '14 at 15:34
Holy smokes, I just barely posted this 1 min ago and have a bunch of responses. Actually I apologize, i just did a search and found this answer above. Thanks Huangism. — user3791854, Jul 10 '14 at 15:37
As a side note about conventions, some people omit braces if the entire expression including the if (`if (condition) do_something();`) fits on a single line. As soon as `do_something()` is too long to go on the same line, many people will add braces for readability even though they are not needed. — Elise, Jul 10 '14 at 15:37
Thanks this feels like a huge step in my understanding of JS. — user3791854, Jul 10 '14 at 15:40

score 4 · Answer 1 · edited Jun 20 '20 at 09:12

You can use if with any single statement, whether that statement is a block statement or any other kind.

The grammar for the if statement in ECMAScript is:

IfStatement :

    if ( Expression ) Statement else Statement
    if ( Expression ) Statement

Notice that there are no curly braces defined. Any valid statement is permitted.

This:

 if (condition)
     then_case();
 else
     else_case();

evaluates the same as this:

 if (condition) {
     then_case();
 } else {
     else_case();
 }

If your have multiple statements, then you need a block statement in order to contain them.

 if (condition) {
     then_case();
     also_this();
 } else {
     else_case();
     also_that();
 }

Sometimes you see things like

 if (condition)
      then_case(), also_this();

which evaluates, but is ugly. (Best just forget my last example. :-) )

@cookiemonster, sorry there was no warning that I overwrote your changes. — Kijewski, Jul 10 '14 at 15:40

score 3 · Answer 2 · edited May 23 '17 at 11:54

3

Your example code is syntactically correct. You may omit the brackets assuming you have a single line of code after your if/else statement.

if (condition)
    //Do something
else
    //Do something

Many folks, including myself, loath this practice. Check out further discussion here:

edited May 23 '17 at 11:54

Community

1
1

answered Jul 10 '14 at 15:34

James Hill

60,353
20
145
161

I second this, it just invites problems down the line. Keep the code clean and readable. – Smeegs Jul 10 '14 at 15:35
Wasn't there a motion in ECMAScript Harmony to allow `if condition { … }`, i.e. omitting the parentheses? Does anyone know what became of that? – Kijewski Jul 10 '14 at 15:44
Many folks appreciate this practice when used sensibly, as it reduces noise. – cookie monster Jul 10 '14 at 15:46
@cookiemonster, which is why I said **many** folks, not **all** folks. Not sure that's worth a downvote. I think you should read up on the guidelines for downvoting: http://stackoverflow.com/help/privileges/vote-down – James Hill Jul 10 '14 at 15:47
Because it's a **mere opinion** that degrades the quality of the answer. Also to say you may omit the brackets assuming you have a single line of code isn't correct. You may have multiple lines as long as they form a single statement. And the brackets aren't part of the `if` statement to begin with, so it's not a question of omitting them. It's a question of what type of statement is used. The quality of the answer earned my down vote. – cookie monster Jul 10 '14 at 15:51
And if you can find factual flaws in my answer that you downvoted, I'd be happy to hear about them. – cookie monster Jul 10 '14 at 17:06

score 0 · Answer 3 · answered Jul 10 '14 at 15:35

0

Similar to other 'c' syntax languages, the scope of the context may be omitted if the statement is only a single line.

e.g.

if(true)
    alert('hello');

is equal to

if(true) alert('hello');

is equal to

if(true){ alert('hello'); }

You may also see another form

var myBool = Boolean(someValue) ? false : true

answered Jul 10 '14 at 15:35

Jay

3,276
1
28
38

1

This is my favorite answer. Thanks, I don't have a high enough reputation yet to upvote this. – user3791854 Jul 10 '14 at 15:46
Thank you for your kind words! – Jay Jul 10 '14 at 16:39

score 0 · Answer 4 · answered Jul 10 '14 at 15:35

If you have only one statement to be part of body of if or else, then curly braces are optional. But if you want group of statements to be part of if or else's body then it is mandatory to have curly braces.

if(condition)
    //Only one statement
else if(condition2)
    //Only one statement
else
    //Only one statement

But in the following it is mandatory to have curly braces.

if(condition){
    //first statement
    //second statement
    .....
    //nth statement
}
else if(condition2){
    //first statement
    //second statement
    .....
    //nth statement
}
else{
    //first statement
    //second statement
    .....
    //nth statement
}

And please note, it is not only for JavaScript, it is same behavior in most of the programming languages as well, like C, C++, Java etc.

score -2 · Answer 5 · answered Jul 10 '14 at 15:35

-2

You don't need the curly braces for a one-line consequence of the if statement. But if the consequence of the if statement is multiple statements, then you wrap them in curly braces to identify them as such.

answered Jul 10 '14 at 15:35

PulseLab

1,577
11
15

Javascript if statement-- no {} needed?

5 Answers5