Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
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
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>
Run tests (3)
Previous results
Fork
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
Embed
Embed Benchmark Result
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
llama3.1:latest
, generated one year ago):
Let's dive into the benchmark results. **What is being tested?** The benchmark tests the performance of three different methods for filtering an array: 1. Using the `filter()` method (ECMAScript 5) 2. Using a traditional `for` loop 3. Using a `for...in` loop **Options compared:** We're comparing three approaches to filtering an array: 1. **Filter() method**: The `filter()` method is a built-in JavaScript function that creates a new array with all elements that pass the test implemented by the provided function. 2. **For loop**: A traditional `for` loop iterates over an array, and we're using it to create a new array with filtered elements. 3. **For...in loop**: The `for...in` loop is used to iterate over an object's enumerable properties. However, in this case, we're using it to iterate over the array indices. **Pros and cons of each approach:** 1. **Filter() method**: * Pros: Concise code, easy to read, and well-suited for modern JavaScript development. * Cons: Might be slower than traditional loops due to function call overhead. 2. **For loop**: * Pros: Often faster than `filter()` since it avoids function calls. * Cons: More verbose code, potentially harder to read. 3. **For...in loop**: * Pros: Can be faster than traditional `for` loops when dealing with sparse arrays (arrays containing gaps in the indices). * Cons: Can lead to unexpected behavior if not used carefully, as it iterates over an array's properties rather than its indices. **Other considerations:** 1. **Library usage**: There are no external libraries being used in these benchmarks. 2. **Special JavaScript feature or syntax**: The `filter()` method is a built-in ECMAScript 5 feature, which means it might not be supported in older browsers. 3. **Alternatives**: Other alternatives for filtering arrays include using the `some()` and `every()` methods or a combination of `forEach()` and conditional statements. **Test case explanations:** 1. The first test case uses the `filter()` method to create a new array with all elements that are truthy (i.e., not null or undefined). 2. The second test case uses a traditional `for` loop to achieve the same result. 3. The third test case uses a `for...in` loop, which is generally discouraged when iterating over arrays. **Benchmark results:** The benchmark results show that the `filter()` method performs best on this particular task, followed by the `for` loop, and then the `for...in` loop. However, please note that these results are specific to the test environment and might vary depending on your system configuration and browser.
Related benchmarks:
`Array.slice(-1)[0]` vs `Array[Array.length]`
`Array.slice(-1)[0]` vs `Array[Array.length]` for 10000 length
array.splice vs array.length
`array.slice(-1)[0]` vs `array[array.length - 1]`
Array.push(x) vs array[n]=x
Comments
Confirm delete:
Do you really want to delete benchmark?