Post
Ask Question

How to Use While Loop In TypeScript

while Loop in TypeScript

 
A While loop is also a type of loop that will execute code until the given condition is true. You code the keyword "while" followed by a condition expression in parentheses and a block of code in braces. When the while statement is executed, the conditional expression is evaluated. If the expression is true, then the block of code is executed and the while loop is attempted again. As soon as the expression evaluates to false, the block of code is skipped and the while statement is done. If the expression evaluates to false the first time it is checked, the block of code won't be executed at all.
 
Syntax
  1. while( initialize counter<condition)  
  2. {  
  3.   //Our code that should be run  
  4.   increment a counter;  
  5.  }  
The following example shows the factorial of 5. In this example I have a loop class and define a while loop. We initialize a variable f=1. The while loop starts at position 1 and continues as long as n is less than 5. f will increase by 1 each time the loop runs. Let's see how I implement the while loop in TypeScript. Let's use the following steps.
 
Step 1
Open Visual Studio 2012 and click "File" -> "New" -> "Project...". A window is opened. In this window, click HTML Application for TypeScript under Visual C#. Give the name of your application as "factorial" and then click ok.
 
Step 2
After this session the project has been created; a new window is opened on the right side. This window is called the Solution Explorer. Solution Explorer contains the ts file, js file, css file, an html file.
 

Coding

 
factorial.ts
  1. class loop {  
  2.  fact: number;  
  3.  constructor(fact: number) {  
  4.   this.fact = fact;  
  5.  }  
  6.  factorial() {  
  7.   var count = 1;  
  8.   var f = 1;  
  9.   while (f <= this.fact) {  
  10.    count = count * f;  
  11.    f++  
  12.   }  
  13.   alert("Factorial of 5 is ->" + count);  
  14.  }  
  15. }  
  16. window.onload = () => {  
  17.  var s = new loop(5);  
  18.  s.factorial();  
  19. };  
factorialexample.html
  1. <!DOCTYPEhtml>  
  2. <htmllang="en"  
  3.     xmlns="http://www.w3.org/1999/xhtml">  
  4.     <head>  
  5.         <metacharset="utf-8"/>  
  6.         <title>Factorial example TypeScript HTML App</title>  
  7.         <linkrel="stylesheet"href="app.css"type="text/css"/>  
  8.         <scriptsrc="app.js">  
  9.         </script>  
  10.     </head>  
  11.     <body>  
  12.         <h1>Factorial of a Number(5) in TypeScript</h1>  
  13.         <divid="content"/>  
  14.     </body>  
  15. </html>  
app.js
  1. var loop = (function() {  
  2.  function loop(fact) {  
  3.   this.fact = fact;  
  4.  }  
  5.  loop.prototype.factorial = function() {  
  6.   var count = 1;  
  7.   var f = 1;  
  8.   while (f <= this.fact) {  
  9.    count = count * f;  
  10.    f++;  
  11.   }  
  12.   alert("Factorial of 5 is ->" + count);  
  13.  };  
  14.  return loop;  
  15. })();  
  16. window.onload = function() {  
  17.  var s = new loop(5);  
  18.  s.factorial();  
  19. };  
Output
 
final result.gif
 
Referenced By
http://www.typescriptlang.org/


Similar Articles