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 :
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