Nested If-Else In TypeScript

Introduction

 
In this article, I am going to explain how to use TypeScript nested If-Else statements. Using nested If-Else statements, we will find the grade of any student by entering his or her marks.
 
The syntax of a TypeScript nested  If Else is: 
  1. If(Condition)    
  2. {    
  3. //If condition is true then write the statement here    
  4. }    
  5. Else //if condition is false then cursor go to else part    
  6. {    
  7.   If(Condition) //again here check the condition under the else part    
  8.   {    
  9.   //If condition is true then write statement here    
  10.   }    
  11.   Else //if condition is false then cursor go to else part    
  12.   {    
  13.     If(Condition) //again here check the condition under the else part    
  14.     {    
  15.     //If condition is true then write statement here    
  16.     }    
  17.     Else    
  18.     {    
  19.     }    
  20.   }    
  21. }     
Now to see how a nested If-Else is used, let's use the following steps.
 
Step 1
 
Open Visual Studio and click on "File" -> "New" -> "Project...".
 
Step 2
 
Select HTML Application for TypeScript under Visual C# and give the name of your application and then click OK.
 
Step 3
 
Open the app.ts file and write the following code in it: 
  1. class Nested_IfElse {  
  2.  constructor() {}  
  3.  GradingSystem() {  
  4.   var n: number;  
  5.   var s = 0;  
  6.   n = parseInt(prompt("Enter the marks of any student"));  
  7.   if (n >= 80) {  
  8.    alert(" You got A grade");  
  9.   } else if (n >= 60) { // Note the space between else & if    
  10.    alert(" You got B grade");  
  11.   } else if (n >= 40) {  
  12.    alert(" You got C grade");  
  13.   } else if (n < 40) {  
  14.    alert(" You Failed in this exam");  
  15.   }  
  16.  }  
  17. }  
  18. window.onload = () => {  
  19.  var greeter = new Nested_IfElse();  
  20.  greeter.GradingSystem();  
  21. };   
Step 4
 
Open the app.js file and write the following code in it: 
  1. var Nested_IfElse = (function() {  
  2.  function Nested_IfElse() {}  
  3.  Nested_IfElse.prototype.GradingSystem = function() {  
  4.   var n;  
  5.   var s = 0;  
  6.   n = parseInt(prompt("Enter the marks of any student"));  
  7.   if (n >= 80) {  
  8.    alert(" You got A grade");  
  9.   } else {  
  10.    if (n >= 60) {  
  11.     alert(" You got B grade");  
  12.    } else {  
  13.     if (n >= 40) {  
  14.      alert(" You got C grade");  
  15.     } else {  
  16.      if (n < 40) {  
  17.       alert(" You Failed in this exam");  
  18.      }  
  19.     }  
  20.    }  
  21.   }  
  22.  };  
  23.  return Nested_IfElse;  
  24. })();  
  25. window.onload = function() {  
  26.  var greeter = new Nested_IfElse();  
  27.  greeter.GradingSystem();  
  28. };   
Step 5
 
Write the following code in the default.htm file: 
  1. <!DOCTYPE html>  
  2. <html lang="en"  
  3.     xmlns="http://www.w3.org/1999/xhtml">  
  4.     <head>  
  5.         <meta charset="utf-8" />  
  6.         <title>TypeScript HTML App</title>  
  7.         <link rel="stylesheet" href="app.css" type="text/css" />  
  8.     </head>  
  9.     <body>  
  10.         <h1>Nested If Else Example</h1>  
  11.         <div id="content">  
  12.             <script src="app.js"></script>  
  13.         </div>  
  14.     </body>  
  15. </html>     
Step 6
 
Now run the application. The output will look like this.
 
Output-of-nested-ifelse-in-typescript.jpg
 
When I click the OK button it will give a result like this.
 
Display-result-of-nested-ifelse-in-Typescript.jpg
 
Summary
 
In this article, I explained how to use a nested If-Else in TypeScript.


Similar Articles