Benchmark: forEach vs reduce vs map vs filter vs for (slightly optimized for)

Script Preparation code:

var arr = [];
for (var i = 0; i < 12345; i++) {
  arr[i] = i;
}

function someFn(i) {
  return (i * 3 * 8 / 1200 * 0.002 / 40 * 0.2);
}

var sumForEach = 0,
  sumReduce = 0,
  sumMap = 0,
  sumFilter = 0,
  sumFor = 0;

Tests:

forEach
arr.forEach(item => sumForEach += someFn(item));
reduce
sumReduce = arr.reduce((lastValue, item) => { return sumReduce += someFn(item); });
map
arr.map(item => (sumMap += someFn(item)));
filter
arr.filter(item => (sumFilter += someFn(item)));
for
for (let j = 0, len = arr.length; j < len; j++) { sumFor += arr[j]; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
forEach
reduce
map
filter
for

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Autogenerated LLM Summary (model gemma2:9b, generated one year ago):

LLMs can make mistakes. Check important info.

This benchmark compares the performance of five different ways to process an array in JavaScript:

* **forEach:** Iterates over each element in the array and executes a provided function for each element. 
* **reduce:**  Combines all elements of an array into a single value by iterating through it, applying a function to accumulate a result.
* **map:** Creates a new array with the same length as the original array, mapping each element in the original array through a provided function.
* **filter:** Returns a new array containing only the elements that pass a test implemented by the provided function.
* **for loop:**  A traditional iterative approach using a counter and conditional statement to access and process each array element.

Each test case applies a simple mathematical operation (`someFn`) to each array element, summing up the results.

**Pros and Cons:**

* **forEach:** Simple for iterating without needing to accumulate a result.  Less efficient if you need to modify or combine elements.
* **reduce:** Powerful for accumulating a single value from an array. Can be more verbose than other methods.
* **map:** Excellent for transforming each element in an array into a new element.
* **filter:** Useful for selecting specific elements based on a condition.
* **for loop:** More control and potential for optimization, but can be more complex to write.

**Considerations:**

The best approach depends on the task. If you need a single value calculated from all elements, `reduce` is often a good choice. For transforming elements or selecting specific ones, `map` or `filter` are more appropriate. `forEach` is suitable for simple iteration without accumulating a result.

**Alternatives:**

JavaScript offers other array methods like `some`, `every`, and `find`, which can be used depending on the desired outcome. Libraries like Lodash provide additional utility functions that may be more efficient or concise than writing your own logic.

Let me know if you have any other questions!

Related benchmarks:

forEach vs reduce vs map vs filter vs for (slightly optimized for) (version: 0)

Comparing performance of: forEach vs reduce vs map vs filter vs for

Created: 5 years ago by: Guest

Jump to the latest result

forEach

reduce

map

filter

for

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

Autogenerated LLM Summary (model gemma2:9b, generated one year ago):