Post
Ask Question

For-In Statement With Array in TypeScript

For-in statement with array in TypeScript

 
A for-in statement makes it easier to work with an array. The for-in statement doesn't require a separate expression that initializes, tests and increments an index counter like a for loop does. Instead, you declare a variable that will be used to refer to the index of each element in the array. Then, within the loop, you can use this variable to access each element in the array.
 
This loop works primarily with arrays. It allows us to loop through each element in the array, without having to know how many elements the array actually contains. In other words, "For each element in the array, execute some code." rather than having to work out the index number of each element, the for..in loop does it for us, and automatically moves to the next index with each iteration.
 

Syntax

 
The syntax for use with an array is:
  1. for (Index in arrayName) {}  
The following example prints the weekdays using a for-in statement with an array. Let's use the following.
 
Step 1
Open Visual Studio 2012 and click "File" -> "New" -> "Project...". A window is opened. Give the name of your application as "for-in-array" 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. The Solution Explorer contains the ts file, js file, CSS file, an HTML file.
 

Coding

 
for-in-array.ts
  1. class forinarray {  
  2.  start() {  
  3.   var days: string[] = ["Sunday", "Monday", "TuesDay", "Wednesday", "Thursday", "Friday", "Saturday"];  
  4.   var d: string;  
  5.   for (d in days) {  
  6.    var span = document.createElement("span");  
  7.    span.innerText = days[d] + "\n";  
  8.    document.body.appendChild(span);  
  9.   }  
  10.  }  
  11. }  
  12. window.onload = () => {  
  13.  var greeter = new forinarray();  
  14.  greeter.start();  
  15. };  
Demo.html
  1. < !DOCTYPEhtml >   
  2.  <  
  3.  htmllang = "en"  
  4. xmlns = "http://www.w3.org/1999/xhtml" >  
  5.  <  
  6.  head >  
  7.  <  
  8.  metacharset = "utf-8" / >  
  9.  <  
  10.  title > TypeScript HTML App < /title>  
  11.  <  
  12.  linkrel = "stylesheet"  
  13. href = "app.css"  
  14. type = "text/css" / >  
  15.  <  
  16.  scriptsrc = "app.js" > < /script>  
  17.  <  
  18.  /head>  
  19.  <  
  20.  body >  
  21.  <  
  22.  h2 >  
  23.  for - in statement with array in TypeScript < /h2>  
  24.  <  
  25.  h3 > Week Days < /h3>  
  26.  <  
  27.  divid = "content" / >  
  28.  <  
  29.  /body>  
  30.  <  
  31.  /html>  
app.js
  1. var forinarray = (function() {  
  2.  function forinarray() {}  
  3.  forinarray.prototype.start = function() {  
  4.   var days = ["Sunday", "Monday", "TuesDay", "Wednesday", "Thursday", "Friday", "Saturday"];  
  5.   var d;  
  6.   for (din days) {  
  7.    var span = document.createElement("span");  
  8.    span.innerText = days[d] + "\n";  
  9.    document.body.appendChild(span);  
  10.   }  
  11.  };  
  12.  return forinarray;  
  13. })();  
  14. window.onload = function() {  
  15.  var greeter = new forinarray();  
  16.  greeter.start();  
  17. };  
Output
 
final-result.jpg
 
Reference By
 
http://www.typescriptlang.org/


Similar Articles