JavaScript Array forEach()

To loop through an array's elements, you can use the built-in array method Array.forEach(). The forEach() method takes a callback function as an argument and calls it once for each array element. The forEach() method will not be called on removed or missing array elements. However, the method will be called for elements that are in the array and have the value undefined. In this JavaScript example, we use the forEach() method to execute a given function on each element of an array. Click on Execute to run JavaScript Foreach Method Example online and see the results.
JavaScript Array forEach() Execute 
let array = [30, 15, 30];
let sum = 0; 

array.forEach(
    function (item) {
        sum += item;
    }
);

console.log(sum)
Updated: Viewed: 1774 times

JavaScript Array forEach() Method

The JavaScript array.forEach() method allows you to execute the passed function once for each element in the array in ascending index order. The function will not be called on elements added to the array after it was called. The callback function passed as a parameter to the forEach() method will not be called for removed or missing array elements. However, it will be called for elements that have the value undefined.

JavaScript Array forEach() Syntax
array.forEach(callback(), thisValue)

Where:
  • callback: a callback function will be executed once for each element in the array. If something that is not a function is passed as a method parameter, then a TypeError exception will be raised.
  • thisValue (optional): an object that can be referenced by the "this" keyword inside the function. If thisValue parameter is not passed, "this" will be "undefined"

JavaScript Array forEach Method Examples

The following are examples of iterating over an array in JavaScript using forEach() method with a detailed description:

Calculating the sum of array elements using forEach()

Below is an example of how to calculate the sum of an array items using forEach() in JavaScript:

JavaScript Calculate Sum of Array Elements with forEach Example
let array = [10, 25, 30];
let sum = 0; 

array.forEach(
    function (item) {
        sum += item;
    }
);

console.log(sum)

// output: 65

Iterating over the elements of an array containing objects

Below is an example of iterating over the elements of an array containing objects using forEach() in JavaScript:

JavaScript Calculate the Square of a Numbers with forEach Example
const fruits = [
    {name: 'strawberry', color: 'red'},
    {name: 'chery', color: 'red'},
    {name: 'apple', color: 'green'},
    {name: 'grape', color: 'yellow'},
]
let redFruits = [];

fruits.forEach (function (fruit) {
    if (fruit.color === 'red') redFruits.push(fruit.name);
})

console.log(redFruits);

// output: strawberry,chery

Getting the index of an element when using forEach()

The index is passed as the second argument to the callback function when using the forEach() array method. Below is an example of how to get the index of an array element using forEach() in JavaScript:

JavaScript Get Index Property with forEach() Example
students = ["Leo", "Jack", "Alice"];

students.forEach((name, index) => console.log(`${index}: ${name}`));

// output: 
// 0: Leo
// 1: Jack
// 2: Alice

See also

JavaScript Foreach Related API examples and articles