Navigate back to the homepage

How to use for loop in typescript?

Infinitbility
TypeScript
March 11th, 2022 · 1 min read
keep affilitate

Hello Friends 👋,

Welcome to Infinitbility.

Today, we will learn how many ways have to write for loops in typescript.

In this tutorial, we will see examples of simple for, for.. of, and for.. in loop.

Let’s create a sample array of objects which we will use all for loops example.

1interface User {
2 id: number;
3 name: string;
4}
5
6let users: Array<User> = [
7 { id: 1, name: 'infinitbility' },
8 { id: 2, name: 'notebility' },
9 { id: 3, name: 'repairbility' },
10];

TypeScript for loop

Let’s write our most used syntax, Yes for with their three statment.

1interface User {
2 id: number;
3 name: string;
4}
5
6let users: Array<User> = [
7 { id: 1, name: 'infinitbility' },
8 { id: 2, name: 'notebility' },
9 { id: 3, name: 'repairbility' },
10];
11
12for (let i = 0;i < users.length;i++) {
13 console.log("users", users[i])
14}
TypeScript, for loop example
TypeScript, for loop example

TypeScript for of loop

The for.. of loop same as for-each loop let’s see how we will use it in typescript.

1interface User {
2 id: number;
3 name: string;
4}
5
6let users: Array<User> = [
7 { id: 1, name: 'infinitbility' },
8 { id: 2, name: 'notebility' },
9 { id: 3, name: 'repairbility' },
10];
11
12for (let user of users) {
13 console.log("user", user)
14}
TypeScript, for of loop example
TypeScript, for of loop example

The for..in loop which returns the key of the array and of object let see, how we can use for..in loop in typescript.

1interface User {
2 id: number;
3 name: string;
4}
5
6let users: Array<User> = [
7 { id: 1, name: 'infinitbility' },
8 { id: 2, name: 'notebility' },
9 { id: 3, name: 'repairbility' },
10];
11
12for (let user in users) {
13 console.log("users", users[user])
14}
TypeScript, for in loop example
TypeScript, for in loop example

Thanks for reading…

Follow me on Twitter

Join our email list and get notified about new content

No worries, I respect your privacy and I will never abuse your email.

Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.

melio affilitate

Looking For React Native Tutorial?

we are trying to create the best Tutorial for react native developers.

When you want a daily updates about React Native Tutorial or infinitbility update subscribe to our newsletter.

Read React Native Tutorial

Request New Tutorial or Article on mail [email protected]

Guide book

Guidebook: The Javascript Monorepo Photoshop Guide

Tutorials

Categories

More articles from Infinitbility

How to add layer in photopea?

Photopea, add another or new layer example.

March 6th, 2022 · 1 min read

How to find maximum value in array in typescript?

TypeScript, find max value in array or array of objects with example.

March 6th, 2022 · 1 min read
© 2020–2022 Infinitbility
About
Link to $https://medium.com/infinitbilityLink to $https://www.facebook.com/InfinitbilityLink to $https://github.com/infinitbilityLink to $https://twitter.com/infinitbilityLink to $https://www.buymeacoffee.com/infinitbilityLink to $mailto:[email protected]