For Loop in TypeScript

By: Rajesh P.S.

TypeScript's for loops are your trusty companions on the journey of repetitive tasks. They allow you to efficiently iterate through sequences of data, performing the same operation on each element.

Traditional for loop

The traditional for loop is similar to loops in other C-like languages. It has three parts: initialization, condition, and increment/decrement.

for (let i = 0; i < 5; i++) { console.log(i); }

This example initializes a variable i to 0, iterates while i is less than 5, increments i in each iteration, and prints the value of i.

Looping through an array

Continue Reading...

const fruits = ["apple", "banana", "orange"]; for (const fruit of fruits) { console.log(fruit); // Prints each fruit in the array }

This loop iterates through the fruits array. Instead of using an index, it uses the for-of syntax to directly access each element as fruit. This is a cleaner way to loop through collections.

Looping with object properties

const user = { name: "John", age: 30 }; for (const key in user) { console.log(`${key}: ${user[key]}`); // Prints "name: John", "age: 30" }

This loop iterates through the object's properties. The for-in syntax provides the property names in each iteration. You can access the corresponding values using indexing with user[key].

Advanced loop control

for (let i = 10; i >= 0; i--) { if (i % 2 === 0) { continue; // Skip even numbers } console.log(i); // Prints odd numbers from 9 to 1 }

This loop demonstrates advanced control mechanisms. First, it iterates from 10 to 0 (reverse order). Inside the loop, the continue statement skips even numbers by ignoring them and moving to the next iteration. This showcases selective execution within the loop.

Nested loops

const rows = 3; const columns = 5; for (let i = 0; i < rows; i++) { for (let j = 0; j < columns; j++) { console.log(`(${i}, ${j})`); // Prints coordinates of each cell } }

This example uses nested loops. The outer loop iterates through the rows, and the inner loop iterates through the columns. This allows for multi-dimensional iteration patterns.

for...of loop

The for...of loop is used for iterating over iterable objects, such as arrays, strings, or other iterable collections.

let colors: string[] = ["red", "green", "blue"]; for (let color of colors) { console.log(color); }

In this example, the for...of loop iterates over each element in the colors array, assigning the current element to the variable color, and then prints each color.

for...in loop

The for...in loop is used for iterating over the properties of an object.

let person = { name: "John", age: 30, city: "New York" }; for (let key in person) { console.log(`${key}: ${person[key]}`); }

Here, the for...in loop iterates over the properties of the person object, and for each property, it prints both the key and the corresponding value.

These for loops provide flexibility in handling different types of iteration scenarios. The traditional for loop is versatile and can be used for various scenarios, while for...of is specifically designed for iterating over iterable values, and for...in is used for iterating over object properties.

Conclusion

The for loops provide versatile mechanisms for iteration. The traditional for loop is used for numeric iterations, for...of is designed for iterating over iterable objects like arrays, and for...in is used to loop through the properties of an object.

Next > TypeScript while Loop

Related Topics

More Related Topics.....

TypeScript Functions