JavaScript

Conditional Statements in JavaScript

Conditional statements are responsible to execute a piece of code depending upon some conditions. Most frequently the conditional statements are used in decision-making scenarios. In this post, we will address the conditional statements thoroughly.

In JavaScript, different conditional statements are available to perform different operations. Various types of conditional statements are listed below:

  • The “if” statement is used to test whether a block of code can run or not depending on the condition. i.e. if the condition for “if-statement” is true then, in this case, the statements within the body of “if-statement” will run else not.
  • Where the “Else” statement will execute only if the same condition is false and a piece of code written inside the body of the “else-statement” will execute in this case.
  • Else if” can be utilized to define a new condition i.e. if someone wants to check multiple conditions (more than 2 conditions) then the “else if” statement will be used.

JavaScript if Statement

Syntax of if-statement:

if (condition)

{

// body will execute only if the condition is correct.

}

To understand the working of if statement let’s consider the example that prints “well done” if marks are greater than 85:

var marks, output;

marks= prompt("Enter you marks");

if (marks > 85) {

     output = "Well done";

     console.log(output);

  }

}

We take the input from the user using the prompt function and assign the user’s input to the variable “marks”. Next, the value stored in the “marks” is tested using the “if statement”:

When you run this code a pop-up window will appear as shown in the below-given screenshot:

If the value entered by the user is greater than 85 then it will show an output “Well done”:

In this example, we didn’t specify anything for the false condition. So, if the user enters the false condition, let’s say the user enters 55 it wouldn’t show any output instead it will show a blank page because we didn’t specify anything for false conditions.

Now we will extend the above-given example with the “else” statement in order to tackle the false statement.

JavaScript else Statement

Syntax of else statement is mentioned below:

if (condition)

{

// body will be executed only if the condition is true.

}

else

{

// else part will run in that case when the condition is not true.

We will extend our program to print “well done” if marks are greater than 85 and print “better luck next time” if condition is false:

var marks, output;

marks= prompt("Enter your marks");

if (marks > 85) {

     output = "Well done";

     console.log(output);

  }

else

{

    console.log("better luck next time");

}


When we run this code a pop-up window will appear asking the user to enter the marks:

Now if the entered marks are greater than 85 it will show “well done” else it will show “better luck next time”. Here, we enter 56 so the output will be:

JavaScript else if Statement

Now we will use else if to specify a new condition for our program if marks are greater than 85, print “well done” else if marks are greater than 50 but less than 85 then print “Good” else print “better luck next time”:

var marks, output;

marks= prompt("Enter you marks");

if (marks > 85) {

     output = "Well done";

     console.log(output);

  }

else if (marks> 50 && marks<= 85)

{

   console.log("Good");

 }

else

{

    console.log("better luck next time");

}

When we run this code a pop-up window will appear, now this program will tackle three conditions first if the user enters greater than 85 marks then it will show a message “Well done”, else if the user enters marks greater than 50 but less than or equal to 85 then it will display a message “Good” else it will show a message “better luck next time”.

Here, we entered 67:

The output will be:

Conclusion

Conditional statements are commands or conditions that are used for decision-making purposes. These statements perform various actions based on the conditions. This article presents a detailed overview of conditional statements with examples. Initially, we determine the conditional statements next we consider their types. Thereafter we took some examples and understood the conditional statements along with their types. Finally, we implement these examples in JavaScript and achieve the desired output on a live server.

About the author

Shehroz Azam

A Javascript Developer & Linux enthusiast with 4 years of industrial experience and proven know-how to combine creative and usability viewpoints resulting in world-class web applications. I have experience working with Vue, React & Node.js & currently working on article writing and video creation.