Benchmark: Array filter vs. for loop and for in

Script Preparation code:

var arr = [1,2,3,4,null,5,6,"7",8,{a:2},0], farr=[], i,len;

Tests:

Filter
farr= arr.filter(function(item) { return (item); });
For
farr = []; for (i=0,len=arr.length;i<len;i++) { farr.push(arr[i]); }
For in
farr = []; for(i in arr) { farr.push(arr[i]); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Filter
For
For in

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 9 months ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:138.0) Gecko/20100101 Firefox/138.0

Browser/OS: Firefox 138 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
Filter	20780782.0 Ops/sec
For	19695168.0 Ops/sec
For in	2731735.2 Ops/sec

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

LLMs can make mistakes. Check important info.

This benchmark tests three different approaches to filtering an array of mixed data types in JavaScript:

**1. `filter()` Method:**

* **Definition:** This approach uses the built-in `.filter()` method, which iterates over each element in the array and returns a new array containing only elements that pass a specific test (a function provided as an argument).
* **Pros:** Concise syntax, optimized for performance by JavaScript engines. Handles arrays efficiently and can be chained with other array methods.

**2. `for` Loop:**

* **Definition:** This approach uses a traditional `for` loop to iterate over the array's indices and conditionally add each element to a new array (`farr`).
* **Pros:** Direct control over iteration, more explicit for manual manipulation of elements.
* **Cons:** Less concise than `.filter()`, can be less efficient due to potential overhead compared to optimized methods like `.filter()`.

**3. `for...in` Loop:**

* **Definition:** This approach uses a `for...in` loop to iterate over the *keys* of the array (which are numerically indexed in this case). It then accesses the elements using these keys and adds them to the new array (`farr`).
* **Pros:** Can be used for iterating over object properties, but less efficient for arrays compared to a `for` loop.

**Considerations:**

* The `.filter()` method is generally considered the most efficient and readable approach for filtering arrays in JavaScript. It leverages built-in optimizations and provides a clear syntax.
* For specific scenarios where precise control over iteration or complex manipulations are required, a traditional `for` loop might be more suitable.
* `for...in` loops are best suited for iterating over object properties, not arrays. Using them for arrays can lead to performance issues.

Let me know if you have any other questions about this benchmark!

Related benchmarks:

Array filter vs. for loop and for in (version: 0)

This version declares i once before

Comparing performance of: Filter vs For vs For in

Created: 7 years ago by: Guest

Jump to the latest result

Filter

For

For in

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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