Ways of iterating over a array in JavaScript

In this article, we will learn how to iterate over an array using JavaScript. There are multiple ways to do so. Arrays in JavaScript are single variables used to store different kinds of elements.

There mare many ways to iterate over an array in JavaScript. These are:

• Using for Loop
• Using while Loop
• Using forEach() Method
• Using every() Method
• Using reduce() Method
• Using some() Method

Example: In this example, we will access simple array elements using their index number.

javascript

let array = ['geeks', '4', 'geeks'];

// Accessing array elements one by one
console.log(array[0]);
console.log(array[1]);
console.log(array[2]);

Output

geeks
4
geeks

There are multiple ways one can iterate over an array in JavaScript. The most useful ones are mentioned below.

Using for Loop: The for loop executes a set of instructions repeatedly until the given condition becomes false. It is similar to for loops in other languages like C/C++, Java, etc.

javascript

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

for (let index = 0; index < array.length; index++) {
    console.log(array[index]);
}

Output

1
2
3
4
5
6

Using while loop: A While Loop in JavaScript is a control flow statement that allows the code to be executed repeatedly based on the given boolean condition.

javascript

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

while (index < array.length) {
    console.log(array[index]);
    index++;
}

Output

1
2
3
4
5
6

Using forEach() Method: The forEach method calls the provided function once for every array element in the order. 

javascript

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

array.forEach(myFunction);

function myFunction(item, index) {
    console.log(item);
}

Output

1
2
3
4
5
6

Using every() Method: The every() method checks if all elements in an array pass a test (provided as a function). 

javascript

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

const under_five = x => x < 5;

if (array.every(under_five)) {
    console.log('All are less than 5');
}
else {
    console.log('At least one element is not less than 5');
}

Output

At least one element is not less than 5

Using map() Method: A map applies a function over every element and then returns the new array. 

javascript

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

let square = x => Math.pow(x, 2);

square = array.map(square);

console.log(array);
console.log(square);

Output

[ 1, 2, 3, 4, 5, 6 ]
[ 1, 4, 9, 16, 25, 36 ]

Using Filter() Method: It is used to filter values from an array and return the new filtered array.

Javascript

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

let even = x => x % 2 === 0;
let evens = array.filter(even);

console.log(array);
console.log(evens);

Output

[ 1, 2, 3, 4, 5, 6 ]
[ 2, 4, 6 ]

Using reduce() Method: It is used to reduce the array into one single value using some functional logic.

Javascript

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

const helperSum = (acc, curr) => acc + curr;

const sum = array.reduce(helperSum, 0);

console.log(array)
console.log(sum);

Output

[ 1, 2, 3, 4, 5, 6 ]
21

Using some() Method: It is used to check whether some array values pass a test.

Javascript

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

const lessthanFourCheck = (element) => element < 4;
const lessthanFour = array.some(lessthanFourCheck);

console.log(array);

if (lessthanFour) {
    console.log("At least one element is less than 4")
} else {
    console.log("All elements are greater than 4 ")
}

Output

[ 1, 2, 3, 4, 5, 6 ]
At least one element is less than 4