Introduction to Nested if in JavaScript
In every programming language, we use multiple conditional statements that are supported by that language. In the case of javascript, there is one conditional statement that allows you to check and verify the conditions and define your working depending on some other conditions. This is possible by using the nested if statement supported by javascript. In this article, we will learn how we can use nested if conditional statement to check the conditions within other conditions.
We can check the conditions and accordingly define the code to be executed inside some other checked condition using nested if statements in javascript. Nesting of conditional statements can be done up to any number of levels as required as per the use case while coding. Firstly, we will discuss the syntax and flow of execution followed while using the nested if statements which can also be accompanied by else statements. Further, We will learn how we can implement nested if with the help of some examples.
While real-time coding, nested if can be used while booking flight, bus or hotel tickets depending on the number of persons then depending on the number of days for the stay or return ticket, or while grading and selection process and process which involves multiple criteria depending on some other criteria. Besides nested if statements there are many other conditional statements in javascript like an if-else ladder, switch statement and so on.
Syntax
if(first condition){
// This code block executes when the first condition evaluates to true or equivalent result and // then it goes for checking the second condition in the nested loop
if(second condition){
// This code block executes when the second condition
// evaluates to true or equivalent result
}else{
// This code block executes when the second condition
// evaluates to false or equivalent result
}
}else{
// This code block executes when the first condition evaluates to a true or equivalent result
}The above syntax is completely modifiable and restructures according to the necessity of the use case while coding for real-time situations. It may or may not contain else statements. It may have any number of if statements up to any number of levels and can be done inside if or even else statements.
Flowchart:
The above flow diagram can be represented in the algorithmic format for coding.
Syntax:
If (Test Expression){
// Body of if statement
}else{
If(Nested Test Expression){
//body of nested if statement
}else{
//body of nested else statement
}
}
//Statement just below if statementThe above code will first check the Test Expression condition and if that evaluates to true then body if statement will execute and in the else statement we have again checked the condition which is Nested Test expression which when results to true then the body of nested if statement will execute and if that condition results to false or equivalent value then the body of nested else statement will execute.
Example of Nested if in JavaScript
Below is the example of Nested if in JavaScript:
Code:
<!DOCTYPE html>
<html>
<head>
<title> EDUCBA - Demonstrated of nested if statements in javascript </title>
</head>
<h1> Demonstrated of nested if statements in javascript.</h1>
<body>
<script>
var marks = 75;
var participations= true;
if( marks < 60 )
{
document.write("<b> Better Luck Next Time. </b>");
document.write("<br\> You Are Not Eligible For This Position " );
}
else
{
if (marks <= 80 && participations == true )
{
document.write("<b> Your academics and sports balance your score. You are Eligible for this position </b> ");
document.write("<br\> Go ahead for filling your application form. " );
}
else if(marks > 80)
{
document.write("<b> Your academics are great! You are eligible for this position. </b>");
document.write("<br\> Proceed further for filling the application form." );
}else {
document.write("<b> Better Luck Next Time. </b>");
document.write("<br\> You Are Not Eligible For This Position " );
}
}
</script>
</body>
</html>Output:
If the score is 90 or above and participations is either true or false the output will be:
Description and Analysis
In the above example, we have to code for a particular post-selection system based on the academics and sports participation of the candidate. If the score of the person is less than 60 marks then he is not eligible for the post. If the score is between 60 and 80 it will depend on whether he/she participates in the sports activities. If the score is above 80 then irrespective of the participation in sports the candidate will be selected for the post ad further proceedings. So, while writing code for such a scenario the first condition to be checked will be whether the score is greater than or equal to 60 or less than 60. If it is greater than 60 or equal to 60 we will again check this condition by using the nested conditional if statement inside the else statement.
As the current score is 75 and participations are true then the first condition of if that is marks are less than 60 will evaluate to false and then it will go to else statement. Inside the else statement it will check for the nested if statement which will check if the score is less than 80 as above 80 scores will not be checked for participation. Here, in the nested, if statement we will first check whether our score is less than or equal to 80 which will evaluate to true as it is 75 and further as that is not just the sufficient criteria for 60-80 range of score, we will check whether that candidate participates in the sports activities which are true. So, he will be selected for further proceedings.
Recommended Articles
This is a guide to Nested if in JavaScript. Here we discuss a brief overview of Nested if in JavaScript and its Examples along with its Code Implementation. You can also go through our other suggested articles to learn more –
