A Beginner’s Guide to If/Else Conditions in JavaScript

Introduction

In the programming world, the if/else condition is an essential aspect, and it is used extensively. It is a crucial component in making our programs flexible and providing users with a better experience. It is also vital in obtaining the exact data we require and shaping it accordingly. Although if/else conditions perform a similar function in all programming languages, this article focuses on how they work in JavaScript. Let's code so that we understand what is if/else condition.

 if(your condition) {
 // code to be executed if the condition is true
 } else {
 // code to be executed if the condition is false
 }

This is the structure of this condition. Let's break it down step by step so that we understand it well.

Breaking Down the Problem:

In the if (condition) statement, you need to specify a condition inside the parentheses that will evaluate to either true or false. If the condition evaluates to true, the code block inside the curly braces {} will execute. If the condition evaluates to false, and an else block is provided, the code inside the else block will execute instead. Let's implement this in real examples:

 let marks = 35;

 if(marks < 33) { 
   console.log("fail")
 } else {
   console.log("pass")
 }

 // output: pass

Did you notice how the finalized condition triggered the code within the else body? Remember we can omit {} it will still work but using {} is recommended and good practice.

Let's try to go into the depth of the this condition.

It was a basic version of the if/else statement but don't worry it is enough for learning all about the condition. You know we can use this condition more advanced so that we can get the exact thing that we are looking for. We can use more than one condition in one place by adding && and || logical operators. && mean AND logical operator and || mean OR logical operator. These operators give us more flexibility to achieve effective results.

Using '&&' AND ALSO operators:

 let marks = 99;

 if(marks <= 100 && marks >= 90) {
   console.log("Excellent")
 } else if(marks <= 90 && marks >= 80) {
   console.log("Good")
 } else if(marks <= 80 && marks >=70) {
   console.log("Not Bad")
 } else {
   console.log("Bad")
 }
 // output: Excellent

Let's break this down so that we can understand it clearly. Starting with the first line, if(marks <= 100 && marks >= 90), we check if the marks are less than or equal to 100 and greater than or equal to 90. If this condition is false, it moves to the next condition, and continues checking each subsequent condition until one of them is true. Remember, we use else if when we want to add another condition, and finally, we use else, which means that if all preceding conditions are false, this block will always execute.

Using '||' OR operators:

 let marks = 101;

 if(marks <= 100 || marks >= 90) {
   console.log("Excellent")
 } else { 
   console.log("Bad")
 }
 // output: Excellent

Remember, the && operator is only true if all the conditions are true. But the || operator will be true even if only one condition is true, and it will execute the result placed in that specific condition body.

if(marks <= 100 && marks >= 90) this will only be true when both are all the conditions fulfilled this condition. This cares about all conditions.

if(marks <= 100 || marks >= 90) this will be true when any of the condition will be true. This doesn’t depend on the other condition.