JavaScript forEach Method (with Example)

In this tutorial, you will learn what is Javascript forEach method and how to use it, with the help of multiple examples.

Javascript forEach() is an array method that is used to call and iterate a function over each element of an array. forEach method was introduced in  ECMAScript5 (ES5). In simple words, forEach works as a loop. 

If you’ve ever used a loop to iterate over each element of an array then you’ll definitely love the forEach() method. It does the same thing in a more simple and more concise way.

Javascript forEach()

Now let’s understand the syntax and working of the forEach() method.

Also Read :

How to Print in Javascript – 3 Ways with Example
Javascript Array Find()
Javascript Array Length

Syntax of forEach()

Here is the syntax of the array forEach() method : 

array.forEach(function(currentValue, index, arr))

Parameters,

function() – it is the function that will run for each array element (Required).

index – it is the index of the current array element (Optional).

arr – it is the array of the current element (Optional).

Example 1: forEach with an array

Here we are using forEach to print the names of the people with the “Hello”:

const names = ["john", "martin", "boris", "miller"];

//function to say hello
function sayHello(person) {
    //here we are printing names with hello
    console.log('Hello ' + person);
}
names.forEach(sayHello);

Output

Hello john
Hello martin
Hello boris
Hello miller

Example 2: Updating array elements with forEach

Here we are squaring each array element with the help forEach :

const arr = [1, 2, 3, 4, 5];

//function for squaring every arr element
function numSquare(element, index, arr) {
    //here we are squaring the elements
    arr[index] = element * element;
}

arr.forEach(numSquare);

console.log(arr);

Output

[ 1, 4, 9, 16, 25 ]

Example 3: forEach with Arrow Function

Here we are using forEach with an arrow function :

const names = ["john", "martin", "boris", "miller"];

//same as example 1 but in a more concise way
names.forEach(person => {
    console.log('Hello ' + person)
});

Output

Hello john
Hello martin
Hello boris
Hello miller

Example 4: for loop vs forEach

Here we are writing the same program with for loop and with forEach to compare them both :

Using for loop

const names = ["john", "martin", "boris", "miller"];

//same as example 1 but in a more concise way
names.forEach(person => {
    console.log('Hello ' + person)
});

Output

[ 'john', 'miller', 'mike', 'boris' ]

Using forEach

const arr = ["john", "miller", "mike", "boris"];
const copyArr = [];

//using forEach for copying items in copyArr
arr.forEach(function(item) {
    copyArr.push(item);
});

console.log(copyArr);

Output

[ 'john', 'miller', 'mike', 'boris' ]

Example 5: forEach with sets

Here we iterating over each element of the set using forEach :

const set = new Set([1, 2, 3]);

// printing set elements
set.forEach(function(item) {
    console.log(item);
});

Output

1
2
3

Example 6: forEach with map

Here we are printing each key-value pair of the map using forEach:

const employees = new Map([
    ["miller", 25],
    ["boris", 30],
    ["john", 35]
]);

// printing key value pairs of map
employees.forEach(function(value, key) {
    console.log(key + ' = ' + value);
});

Output

miller = 25
boris = 30
john = 35

So this was all about the javascript forEach method, hope you understood the concept. If you still have any queries left in your mind then please ask in the comment section below

Leave a Comment

Your email address will not be published. Required fields are marked *