5 Ways to Loop Through JavaScript Arrays

Similar post:

Quick Introduction To 11 Array Iteration Methods In JavaScript

1. For Loop

The safest way to loop through an array, is using a for loop:

var languages = [
    {id: 1, name: 'PHP', ratings: 8},
    {id: 2, name: 'Python', ratings: 9},
    {id: 3, name: 'C', ratings: 8},
    {id: 4, name: 'Go', ratings: 8},
    {id: 5, name: 'Swift', ratings: 7}
];

for(let i = 0; i < languages.length; i++){
    console.log(languages[i].name);
}

// output
PHP
Python
C
Go
Swift

2. for/of Loop

var languages = [
    {id: 1, name: 'PHP', ratings: 8},
    {id: 2, name: 'Python', ratings: 9},
    {id: 3, name: 'C', ratings: 8},
    {id: 4, name: 'Go', ratings: 8},
    {id: 5, name: 'Swift', ratings: 7}
];

for (let lang of languages) {
    console.log(lang.name)
}

// output
PHP
Python
C
Go
Swift

3. forEach()

var languages = [
    {id: 1, name: 'PHP', ratings: 8},
    {id: 2, name: 'Python', ratings: 9},
    {id: 3, name: 'C', ratings: 8},
    {id: 4, name: 'Go', ratings: 8},
    {id: 5, name: 'Swift', ratings: 7}
];

languages.forEach(function(lang, i) {
    console.log(`Id: ${i}, Name: ${lang.name}`);
});

// output
Id: 0, Name: PHP
Id: 1, Name: Python
Id: 2, Name: C
Id: 3, Name: Go
Id: 4, Name: Swift

4. while Loop

var languages = [
    {id: 1, name: 'PHP', ratings: 8},
    {id: 2, name: 'Python', ratings: 9},
    {id: 3, name: 'C', ratings: 8},
    {id: 4, name: 'Go', ratings: 8},
    {id: 5, name: 'Swift', ratings: 7}
];

var i = 0;
while(i < languages.length) {
    console.log(languages[i].name)
    i++;
}

// output
PHP
Python
C
Go
Swift

5. do/while Loop

var languages = [
    {id: 1, name: 'PHP', ratings: 8},
    {id: 2, name: 'Python', ratings: 9},
    {id: 3, name: 'C', ratings: 8},
    {id: 4, name: 'Go', ratings: 8},
    {id: 5, name: 'Swift', ratings: 7}
];

var i = 0;
do {
    console.log(languages[i].name)
    i++
} while(i < languages.length)

// output
PHP
Python
C
Go
Swift

Share this post