Conditional Statements In JavaScript

Introduction

 
In the previous chapter, we learned about Operators in JavaScript, types of operators, and how to use operators in JavaScript with example programs.
 
In this chapter, we will learn about Conditional Statements in JavaScript. These statements are also called Selection Statements.
 
The Conditional Statements in JavaScript:
  1. If Statement
  2. If Else Statement
  3. Elseif Statement
  4. Switch Case Statement

If Statement

 
If Statements are used for the purpose of decision making; they evaluate the statement if the condition is true. To check if the given 'If condition' is satisfied, 'If Statement' is executed; otherwise the condition is false to exit the If condition.
 
Syntax
  1. If (condition)  
  2. {   
  3.      Statement; //given condition is true execute the statement  
  4. }  
Example
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.     <title>if Condition</title>  
  5. </head>  
  6. <body>  
  7.     <h1>Conditional Statement in JavaScript</h1>  
  8.     <script type="text/javascript">  
  9.         var percentage =(prompt("Enter Your Mark"))  
  10.         if (percentage >= 40)   
  11.         {  
  12.             document.write("You Mark is Pass"); //given condition is true execute the statement  
  13.         }  
  14.     </script>  
  15. </body>  
  16. </html>  
Output
 
Conditional Statements In JavaScript
 
Conditional Statements In JavaScript
 

If else Statement

 
'If else Statement' is an improvement over if Statement. It evaluates the statement if the condition is true or false. In this statement, the given 'If condition' is true means to execute the 'if Statement'. On the other hand, if the condition is false it means to execute another block.
 
Syntax
  1. if (Condition)  
  2. {  
  3.       Statement; //true  
  4. }  
  5. else  
  6. {  
  7.       Statement; //false  
  8. }  
Example
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.     <title>if Condition</title>  
  5. </head>  
  6. <body>  
  7.     <h1>Conditional Statement in JavaScript</h1>  
  8.     <script type="text/javascript">  
  9.         var percentage =(prompt("Enter Your Mark"))  
  10.         if (percentage >= 40)   
  11.         {  
  12.             document.write("You Mark is Pass"); //given condition is true execute the statement  
  13.         }  
  14.         else  
  15.         {  
  16.             document.write("You Mark is Fail"); //given condition is false execute the statement  
  17.         }  
  18.     </script>  
  19. </body>  
  20. </html>  
Output
 
Conditional Statements In JavaScript
 
Conditional Statements In JavaScript 
 

Else If Statement

 
It is another decision-making statement. It evaluates the Statement only 'if condition' is true from several conditions, 'elseif statement' can be used many times in a program; if the two conditions are false it means else Statement is executed.
 
Syntax
  1. If (condition 1)  
  2. {  
  3.       statement 1; //true  
  4. }  
  5. elseif (condition 2)  
  6. {  
  7.       statement 2; //true  
  8. }  
  9. else  
  10. {  
  11.       statement; //evaluate if condition is false  
  12. }  
Example
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.     <title>if Condition</title>  
  5. </head>  
  6. <body>  
  7.     <h1>Conditional Statement in JavaScript</h1>  
  8.     <script type="text/javascript">  
  9.         var mark =(prompt("Enter Your Mark"))  
  10.         if (mark>= 90 && mark <=100)   
  11.         {  
  12.             document.write("A Grade"); //given condition is true execute the statement  
  13.         }  
  14.         else if (mark >= 80 && mark <=89)   
  15.         {  
  16.             document.write("B Grade"); //given condition is true execute the statement  
  17.         }  
  18.         else if (mark >= 70 && mark <= 79)   
  19.         {  
  20.             document.write("C Grade"); //given condition is true execute the statement  
  21.         }  
  22.         else if (mark >= 60 && mark <= 69)   
  23.         {  
  24.             document.write("D Grade"); //given condition is true execute the statement  
  25.         }  
  26.         else if (mark >= 35 && mark <= 59)   
  27.         {  
  28.             document.write("E Grade"); //given condition is true execute the statement  
  29.         }  
  30.         else  
  31.         {  
  32.             document.write("Fail"); //given condition is false execute the statement  
  33.         }  
  34.     </script>  
  35. </body>  
  36. </html>  
Output
 
Conditional Statements In JavaScript
 
Conditional Statements In JavaScript 
 
Below 35 mark 
 
Conditional Statements In JavaScript 
 
Conditional Statements In JavaScript
 

Switch Case

 
Switch Case Statement is a control Statement, it is better than If else statements. To improve the readability of a program multiple if-else Statements can be replaced with Switch Statements. In Switch Case Statements, using the break statement will cause an immediate exit from the switch statement as soon as the code under the code is executed.
 
Syntax
  1. Switch (expression){  
  2. Case 1:  
  3.    Statement;  
  4.    Break;  
  5. Case 2:  
  6.    Block of Statement:  
  7.    Break:  
  8. Default:  
  9.    Block of statement:  
  10.   }  
Example
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.     <title>Conditional Statement</title>  
  5. </head>  
  6. <body>  
  7.     <h1>Switch Case in JavaScript</h1>  
  8.     <script type="text/javascript">  
  9.         var days = 3;  
  10.         switch (days)  
  11.         {  
  12.             case 1:  
  13.                 document.write("Sunday");  
  14.                 break;  
  15.             case 2:  
  16.                 document.write("Monday");  
  17.                 break;  
  18.             case 3:  
  19.                 document.write("Teusday");  
  20.                 break;  
  21.             case 4:  
  22.                 document.write("Wednesday");  
  23.                 break;  
  24.             case 5:  
  25.                 document.write("Thusday");  
  26.                 break;  
  27.             case 6:  
  28.                 document.write("Friday");  
  29.                 break;  
  30.             case 7:  
  31.                 document.write("Saturday");  
  32.                 break;  
  33.             default:  
  34.                 document.write("There is no day");  
  35.                 break;  
  36.         }  
  37.     </script>  
  38. </body>  
  39. </html>  
Output
 
Conditional Statements In JavaScript
 

Summary 

In this chapter, we learned about Conditional Statements in JavaScript and how to use these statements with example programs.
Author
Vijayakumar S
Vijayakumar S
404 3.9k 2m