if else Statements In JavaScript vs Ruby And Deep Equals In JavaScript

Comparing if else In JavaScript and Ruby

Ruby Syntax

if [conditional statement]
  [some code]
elsif [conditional statement]
  [some code]
else
  [some code]
end

JavaScript Syntax

if([conditional statement]){
  [some code]
}else if([conditional statement]){
  [some code]
}else{
  [some code]
}

Differences

In JavaScript our conditional statement has to be within parenthesis where in Ruby you don't need them. Ruby also cuts down on a few characters in the 'else if' statement by calling it 'elsif' as one word. Lastly the code execution blocks in JavaScript are defined by curly braces where as in Ruby they are defined by the next statement or the 'end' keyword if it is the last statement.

JavaScript Shorthand Trick

Take our JavaScript syntax example from above:

if([conditional statement]){
  [some code]
}else if([conditional statement]){
  [some code]
}else{
  [some code]
}

In this case, assuming [some code] is only one line of code, we can use a shorthand version of 'if else' in JavaScript. If the code in your block is only one line, the curly braces can be omitted! Like this:

if([conditional statement])
  [some code]
else if([conditional statement])
  [some code]
else
  [some code]

JavaScript will automatically detect and determine that there is only one line of code in each block and execute the code perfectly fine. However, if you need to use multiple lines of code in the block you will need the curly braces to avoid an error.

Why You Should Be Weary About Using The JavaScript Shorthand

Firstly, the curly braces, at least in my opinion, increase the readability of the code. Secondly, if you have to add more lines of code to your blocks, you will also have to add the curly braces. If you're adding more lines to a statement with a ton of 'else if's, that is quickly going to turn into a painstaking nightmare. This can be very cumbersome for yourself or other developers that have to work with your code. Lastly, it's 2019 and if your IDE doesn't add the closing curly brace for you, you should probably find a new one.

JavaScript Deep Equals

When comparing in JavaScript as a developer you must be careful about which comparator operator you are using. Most of the time you will be using the triple deep equals '===' comparator. The difference between the triple equals and the double equals is as follows. A double equals is loose, which means that JavaScript will try to convert the objects being compared to the same type. So for instance if we had

"11" == 11;
//=> true

it would evaluate to true. When using the triple deep equals, comparing the same things would resolve to false.

"11" === 11;
//=> false

And when we have

11 === 11;
//=> true

it evaluates to true! So in conclusion you will generally always be using the deep equals comparator unless for some reason you don't want the types of your variables compared as well as the value.