JavaScript Array.forEach(); Through this tutorial, i am going to show you how to use JavaScript array forEach() with the help of definition, syntax, parameters and examples.
JavaScript array.forEach()
The JavaScript forEach()
method calls a function and iterates over the elements of an array.
Note that:- The js forEach()
method can also be used on Maps and Sets.
Syntax of JavaScript array.forEach()
The following represents the syntax of the forEach()
method; as shown below:
array.forEach(function(currentValue, index, arr), thisValue)
Here,
- function(currentValue, index, arr) – a function to be run for each element of an array
- currentValue – the value of an array
- index (optional) – the index of the current element
- arr (optional) – the array of the current elements.
Example 1 – JavaScript forEach with Arrays
Here, i will take first example using the forEach()
method; To iterate forEach loop over an array; as shown below:
let students = ['Mack', 'Lee', 'John']; // using forEach students.forEach(myFunction); function myFunction(item) { console.log(item); }
Output
Mack Lee John
Example 2 – Updating the Array Elements
Next example for update the array elements using the javaScript forEach() array method; as shown below:
let students = ['John', 'Sara', 'Jack']; // using forEach students.forEach(myFunction); function myFunction(item, index, arr) { // adding strings to the array elements arr[index] = 'Hello ' + item; } console.log(students);
Output
["Hello John", "Hello Sara", "Hello Jack"]
Example 3 – forEach with Arrow Function
Let’s see third example using arrow function with the forEach()
method to write a program; as shown below:
// with arrow function and callback const students = ['John', 'Sara', 'Jack']; students.forEach(element => { console.log(element); });
Output
John Sara Jack
Example 4 – for loop to forEach()
Here is an example of how you can write a program with for
loop and with forEach()
.
Using for loop
const arrayItems = ['item1', 'item2', 'item3']; const copyItems = []; // using for loop for (let i = 0; i < arrayItems.length; i++) { copyItems.push(arrayItems[i]); } console.log(copyItems);
Output
["item1", "item2", "item3"]
Using forEach()
const arrayItems = ['item1', 'item2', 'item3']; const copyItems = []; // using forEach arrayItems.forEach(function(item){ copyItems.push(item); }) console.log(copyItems);
Example 5 – for…of with Sets
To iterate through the Set elements using the forEach()
method. As shown below:
// define Set const set = new Set([1, 2, 3]); // looping through Set set.forEach(myFunction); function myFunction(item) { console.log(item); }
Output
1 2 3
Example 6 – forEach with Maps
To iterate through the Map elements using the forEach()
method; as shown below:
let map = new Map(); // inserting elements map.set('name', 'Jack'); map.set('age', '27'); // looping through Map map.forEach (myFunction); function myFunction(value, key) { console.log(key + '- ' + value); }
Output
name- Jack age- 27
Conclusion
In this tutorial, you have learned how to use the JavaScript Array forEach()
method and to call a callback on each element of a javascript array.