Loops

Loops are an important part of any programming language and Typescript is no exception. In this tutorial, I'll explain the different types of loops available in Typescript and how to use them.

For Loop

The for loop is a control flow statement that allows you to repeat a block of code a specific number of times. The syntax for a for loop in Typescript is as follows:

for (initialization; condition; increment) {
  // code to be executed
}

forEach Loop

The forEach loop is a method of the Array object that allows you to iterate over each element in an array and perform a specific action. The syntax for the forEach loop is:

array.forEach(function(element) {
  // code to execute for each element
});

The function parameter is a callback function that is called for each element in the array. The callback function takes one parameter, which represents the current element being processed.

For example:

let array = [1, 2, 3, 4, 5];

array.forEach(function(element) {
  console.log(element);
});

In this example, the forEach loop will iterate over each element in the array and log the element to the console. This will output the following:

1
2
3
4
5

You can also use an arrow function as the callback function for the forEach loop. The syntax for using an arrow function is:

array.forEach(element => {
  // code to execute for each element
});

For example:

let array = [1, 2, 3, 4, 5];

array.forEach(element => {
  console.log(element);
});

This is equivalent to the previous example using a regular function as the callback.

The initialization expression is executed only once, before the loop starts. It is usually used to initialize a counter variable. The condition is evaluated before each iteration of the loop. If the condition is true, the loop continues. If the condition is false, the loop terminates. The increment expression is executed after each iteration of the loop. It is usually used to update the counter variable.

Here's an example of a simple for loop that counts from 1 to 10:

for (let i = 1; i <= 10; i++) {
  console.log(i);
}

This loop will output the numbers 1 through 10 to the console.

For...in Loop

The for...in loop is a control flow statement that allows you to iterate over the properties of an object. The syntax for a for...in loop in Typescript is as follows:

for (let variable in object) {
  // code to be executed
}

The variable is a variable that takes on the value of each property in the object on each iteration of the loop. The loop will terminate when all the properties of the object have been enumerated.

Here's an example of a simple for...in loop that iterates over the properties of an object:

const person = {
  name: 'John',
  age: 30,
  gender: 'male'
};

for (let key in person) {
  console.log(key + ': ' + person[key]);
}

This loop will output the following to the console:

name: John
age: 30
gender: male

For...of Loop

The for...of loop is a control flow statement that allows you to iterate over the elements of an array or other iterable object. The syntax for a for...of loop in Typescript is as follows:

for (let variable of object) {
  // code to be executed
}

The variable is a variable that takes on the value of each element in the object on each iteration of the loop. The loop will terminate when all the elements of the object have been enumerated.

Here's an example of a simple for...of loop that iterates over the elements of an array:

const colors = ['red', 'green', 'blue'];

for (let color of colors) {
  console.log(color);
}

This loop will output the following to the console:

red
green
blue

While Loop

A while loop is a control flow statement that allows you to repeat a block of code as long as a certain condition is met.

The syntax for a while loop in Typescript is as follows:

while (condition) {
  // code to be executed
}

The condition is evaluated before each iteration of the loop. If the condition is true, the loop continues. If the condition is false, the loop terminates.

Here's an example of a simple while loop that counts from 1 to 10:

let i = 1;
while (i <= 10) {
  console.log(i);
  i++;
}

This loop will output the numbers 1 through 10 to the console.

Do...while Loop

The do...while loop is similar to the while loop, except that the code block is executed at least once before the condition is checked. The syntax for a do...while loop in Typescript is as follows:

do {
  // code to be executed
} while (condition);

The code block is executed first, and then the condition is evaluated. If the condition is true, the loop continues. If the condition is false, the loop terminates.

Here's an example of a simple do...while loop that counts from 1 to 10:

let i = 1;
do {
  console.log(i);
  i++;
} while (i <= 10);

This loop will output the numbers 1 through 10 to the console.