In this loop, we know about the number of iterations before the execution of the block of statements. A " for loop " is the best example of this loop. Here, we are going to discuss three types of the loop:
- for loop
- for..of loop
- for..in loop
TypeScript for loop
A for loop serves as a control structure for repetition. It is designed to run a block of code a predetermined number of times. A for statement encapsulates the initialization, condition, and increment/decrement in a single line, resulting in a more concise and easier-to-debug looping structure. The syntax for a for loop is illustrated below.
Syntax
for (first expression; second expression; third expression ) {
// statements to be executed repeatedly
}
The description of the control flow within a "for loop" is as follows:
The initial expression represents the setup phase, which is performed initially and executes a single time. This step enables the declaration and initialization of the variables that control the loop.
The subsequent expression assesses the condition. Should it evaluate to true, the loop's body will be executed. Conversely, if it is false, the loop will not run, and control will transfer to the next statement immediately following the "for" loop.
During the execution of the "for loop" body, the control flow transitions to the increment/decrement statement. This enables the modification of the loop control variables. It is permissible to leave it empty, provided that a semicolon follows the condition.
At this point, the condition is assessed again. If it evaluates to true, the loop runs, and the procedure continues. Once the condition evaluates to false, the "for loop" concludes, signaling the end of its life cycle.
Example
let num = 4;
let factorial = 1;
while (num >= 1) {
factorial = factorial * num;
num--;
}
console.log("The factorial of the given number is: " + factorial);
Output:
TypeScript for..of loop
The for..of loop serves to traverse and retrieve elements from an array, string, set, map, list, or tuple collection. Below is the syntax for the for..of loop.
Syntax
for (var val of list) {
//statements to be executed
}
Example
let arr = [1, 2, 3, 4, 5];
for (var val of arr) {
console.log(val);
}
Output:
TypeScript for..in loop
The for..in loop is utilized with an array, list, or tuple. This loop traverses a list or collection, yielding an index during each iteration. In this context, the data type of "val" must be a string or any. The syntax for the for..in loop is provided below.
Syntax
for (var val in list) {
//statements
}
Example
let str:any = "TypeScript Tutorial";
for (let index in str) {
console.log('Index of ${str[index]}: ${index}');
}
Output:
for..of Vs. for..in Loop
The two loops traverse the lists, yet they do so in distinct manners. The for..in loop provides a list of indexes from the object under iteration, while the for..of loop yields a list of values from the object being iterated.
Below example demonstrates these differences:
let myArray = [10, 20, 30, 40, 50,];
console.log("Output of for..in loop ");
for (let index in myArray) {
console.log(index);
}
console.log("Output of for..of loop ");
for (let val of myArray) {
console.log(val);
}
Output: