Which is the best syntax to use for jQuery conditional statements?

Question

I come from a Perl coders background, so out of habit I always use curly brackets to enclose the actions taken when a conditional statement returns a true. For example, and using jQuery, as this is where I need an explanation as to the difference, this two statements are both equivalent and of valid syntax.

if ($('#user_agreement').is(':checked')) { $('#thanks_message').show(); }  

if ($('#user_agreement').is(':checked')) $('#thanks_message').show(); 

Are my old habits betraying me, and I'm just writting unnecessary extra code without any advantage? Or is one method more effective, or considered more standard to good coding practices? I would really like to understand any differences between the two different syntactical approaches, especially when they both work just as well.

Answer 1

I'm sorry to say, but this has nothing to do with jQuery. This is pure Javascript, through and through. But anyway, here's your answer:

They do the same thing.

HOWEVER.

• The second option, without the curly braces, can only be used for one statement of code. As soon as the fist semi-colon is hit, the rest of the code is outside of the if statement.

• The second option isn't even really frowned upon, but it really should be. It could save developers hours of looking through their code only to realize that they accidentally included a semi-colon right after the if statement. (i.e. they did something unfortunate like:

->

if ( $("#user_agreement").is(':checked')); $("#thanks_message").show();

• The first option allows you to add more lines of code to the conditional statement without having to painstakingly add more curly braces.

• Curly braces simply make your code clearer, especially as in the next bullet ->

• And finally, nesting these thing becomes incredibly confusing. For example:

->

if(var1 == 'string1') 
    console.log("string1");
    if(var2 == 'string2')
        console.log("string2");
else 
    console.log("else");

The indentation indicates the else block goes with the outside if--but it actually goes with the inside if.

Answer 2

They are indeed both valid, tho I would personally advice for the usage of curly brackets. They make it clearer which lines are part of the if. This however is a very personal issue. Some people prefer to use them, others don't.

The advantage of placing the curly brackets is that your code can become clearer (but in that case, I would also advise the usage of newlines.