.forEach()
In JavaScript, the .forEach()
method loops over a given array, passing each item in the array into the callback function provided. It is a higher-order function that accepts a callback function as an argument.
Syntax
array.forEach(function(currentValue, index, arr), thisValue);
Parameters:
currentValue
: The current element being processed in the array.index
(Optional): The index of the current element.arr
(Optional): The array itself.thisValue
(Optional): Value to use asthis
when executing callback.
Note: Unlike a regular
for
loop,.forEach()
method does not provide a way to terminate iteration before all elements have been passed to the function.
Example 1: Basic Usage of .forEach()
This example uses the .forEach()
method to print each element in an array:
['a', 'b', 'c'].forEach((letter) => console.log(letter));
The output would be:
abc
Example 2: Summing Elements Using .forEach()
This example uses the .forEach()
method to sum the elements in an array:
const values = [7, 17, 34, 41, 22, 5];let sumOfValues = 0;values.forEach((value) => (sumOfValues += value));console.log(sumOfValues);
The output would be:
126
Codebyte Example: Multiplying Elements Using .forEach()
This codebyte example uses the .forEach()
method to multiply the elements in an array:
Frequently Asked Questions
1. What is the difference between .map()
and .forEach()
?
The main difference between .map()
and .forEach()
is that .map()
returns a new array with transformed elements, while .forEach()
performs operations on each element without returning anything.
Use .map()
for data transformation and .forEach()
for side effects like logging or DOM updates. Also, .map()
is chainable, but .forEach()
is not.
2. Is JavaScript .forEach()
in order?
Yes, .forEach()
executes its callback in order, from index 0
to the last element of the array. It is synchronous and does not skip elements (unless the array is modified during iteration).
3. Which is faster: .map()
or .forEach()
?
In general, .forEach()
and .map()
have very similar performance, but:
.forEach()
is usually slightly faster in most JavaScript engines..map()
creates a new array, which introduces a bit more overhead.
However, the performance difference is negligible for small to medium datasets. The key factor should be readability and intent, not raw speed.
Contribute to Docs
- Learn more about how to get involved.
- Edit this page on GitHub to fix an error or make an improvement.
- Submit feedback to let us know how we can improve Docs.
Learn JavaScript on Codecademy
- Career path
Front-End Engineer
Front-end engineers work closely with designers to make websites beautiful, functional, and fast.Includes 34 CoursesWith Professional CertificationBeginner Friendly115 hours - Free course
Learn JavaScript
Learn how to use JavaScript — a powerful and flexible programming language for adding website interactivity.Beginner Friendly15 hours