Benchmark: Array loop vs foreach vs map vs for vs for of

Script Preparation code:

   var arr = [];
    for (var i = 0; i < 1000; i++) {
      arr[i] = i;
    }
  
    function someFn(i) {
      return i * 3 * 8;
    }

Tests:

foreach
arr.forEach(function (item){ someFn(item); })
for
for (var i = 0, len = arr.length; i < len; i++) { someFn(arr[i]); }
map
arr.map(item => someFn(item))
for of
for (var item of arr) { someFn(item); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
foreach
for
map
for of

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 llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

The provided benchmark compares four different approaches to iterate over an array: `forEach`, `for`, `map`, and `for...of`. The script preparation code defines a simple array `arr` with 1000 elements, each initialized with a unique integer value. A function `someFn` is also defined, which takes an integer as input and returns its product with 3 and 8.

Now, let's break down each test case:

1. **`forEach`**: This approach uses the `forEach` method of the array, passing a callback function that calls `someFn` for each element.
2. **`for`**: This traditional loop uses a `var`-declared variable `i`, initialized to 0, and iterates over the array using an incrementing loop condition.
3. **`map`**: This approach leverages the `map` method of the array, which returns a new array with the results of applying `someFn` to each element.
4. **`for...of`**: This modern loop uses the `for...of` syntax, which automatically iterates over an array using a foreach-like behavior.

**Pros and Cons:**

*   **`forEach`**: Pros:
    *   Simple to implement
    *   Implicit iteration bounds
    Cons:
    *   May incur overhead due to callback function creation and execution
*   **`for`**: Pros:
    *   Low overhead, as it's a traditional loop
    Cons:
    *   Explicit iteration bounds can be error-prone
    *   Variable declaration can lead to scope-related issues
*   **`map`**: Pros:
    *   Elegant and concise syntax
    Cons:
    *   Returns a new array, which may incur additional memory allocation and copying
    *   May not be suitable for side-effect-free functions (like `someFn`)
*   **`for...of`**: Pros:
    *   Modern and readable syntax
    *   Implicit iteration bounds
    Cons:
    *   Not widely supported in older browsers or environments

**Library:**
None of the test cases explicitly use any additional libraries beyond built-in JavaScript features. However, the `map` method does rely on the `Array.prototype.map()` method, which is a part of the ECMAScript standard.

**Special JS feature/Syntax:**
The test cases do not utilize any special JavaScript features or syntax beyond those mentioned above.

**Alternatives:**
If you're looking for alternative iteration approaches in JavaScript, consider:

*   **`reduce`**: A reduction method that applies a callback function to each element of an array and accumulates a result.
*   **`filter`**: A filtering method that creates a new array with elements that pass the test implemented by the provided callback function.

In summary, this benchmark compares four different approaches for iterating over arrays in JavaScript: `forEach`, `for`, `map`, and `for...of`. Each approach has its pros and cons, and understanding these trade-offs can help you choose the most suitable iteration method for your specific use case.

Related benchmarks:

Array loop vs foreach vs map vs for vs for of (version: 0)

Comparing performance of: foreach vs for vs map vs for of

Created: 4 years ago by: Guest

Jump to the latest result

foreach

for

map

for of

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):