Evaluating Conditional Statements in JavaScript

Hello everyone, as you know, I love JavaScript. This is my favorite programming language and I like to talk about it and help people around me feel more comfortable with it.

Today, I want to talk about a basic but essential concept of not just JavaScript, but also every programming language, conditional statements. Programming is made up of choices, and as in our everyday life, we need to take decisions based on certain conditions, to be able to accomplish certain things.

In JavaScript, we use if / else if / else and switches to perform those conditions, let’s see how it works, right below;

if Statement :

When evaluating a condition in programming, we need to see if this condition will be either true, or false, and depending on that, perform a specific action. True, or false… yes, as booleans, if a condition is true, it’ll execute a certain action, if it’s false, it won’t get inside this block of code and will move further below to reach the next block.

if (2 > 1) {
  console.log("Correct");
}

As the above condition is true, the if statement will be executed, and the console log “Correct”. It’s great, we can then evaluate if a statement is true or false, and execute a code accordingly.

else Statement :

But, it would be even greater to be able to execute another code if ever the initial if condition returned false. So we can add an else statement.

if (1 > 2) {
  console.log("Are you sure?");
} else {
  console.log("Alright");
}

The logic of our code is already getting better, and our code gets a little more developed, but to that, we can then add something more.

else if Statement:

else if acts as an intermediate statement that we can place between our if and else. While if and else are unique in a conditional statement, we can place as many else if as we need to execute the different conditions we want. Let’s declare a variable age :

let meal = 12;

if (meal === 8) {
  console.log("Let's take breakfast");
} else if (meal === 12) {
  console.log("It's time for lunch");
} else if (meal === 20) {
  console.log("Time for dinner!");
} else {
  console.log("Don't eat too much between meals");
}

As you can see, the possibilities of condition checks are limitless thanks to the use of an else if statement, but too many else if, may be bad if you end up using 10, 100 or more else if. An alternative to that, which is better when you’re having many cases to check, is to use a switch statement.

switch Statement:

A switch is similar to an if / else if / else statement, but a way to make it easier and clearer. Taking a longer example, we immediately see that it’s better to use a switch when having multiple conditions to check.

let day = "Monday";

switch (day) {
  case "Monday":
    console.log("Day 1");
    break;
  case "Tuesday":
    console.log("Day 2");
    break;
  case "Wednesday":
    console.log("Day 3");
    break;
  case "Thursday":
    console.log("Day 4");
    break;
  case "Friday":
    console.log("Day 5");
    break;
  case "Saturday":
    console.log("Day 6");
    break;
  case "Sunday":
    console.log("Day 7");
    break;
  default:
    console.log("The value you entered isn't a day of the week");

On a switch statement, it’s important to add a break at the end of each case, to be able to leave the statement if the condition is evaluated to true, as well as add a default case, which will be similar to an else. For the default case, we don’t need to add a break at the end, the default being the last value on the switch.

Bonus: the ternary operator

In addition to those different ways to write conditional statements, and similar of the if / else if / else statement, there is another one that I particularly like, for it’s gain of space, the ternary operator.

let value = 12;

console.log(value === 12 ? "Great" : "No sorry");

Here, the first part of the statement is the condition to evaluate, followed by a ? and the code that would be executed if the condition is true. If it’s false, this code will be ignored and will go directly to the part after the: Using the ternary operator, we can add as many conditions as we want, as we would be doing for a traditional if / else if / else statement.

Thank you for reading this article, in the new one about JavaScript I’ll be talking about another important concept in JS and in programming in general, the loops.