Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Array filter vs. for loop - with for in
(version: 0)
Comparing performance of:
Filter vs For vs For 2 vs For in
Created:
9 years ago
by:
Registered User
Jump to the latest result
Script Preparation code:
var arr = [1,2,3,4,5,6,7,8,9,0], farr;
Tests:
Filter
farr = arr.filter(function(item) { return (item>4); });
For
for (var i=0,len=arr.length;i<len;i++) { if (arr[i]<5) continue; farr.push(arr[i]); }
For 2
for (var i=0,len=arr.length;i<len;i++) { if (arr[i]>4) farr.push(arr[i]); }
For in
for (var i in arr) { if (arr[i]>4) farr.push(arr[i]); }
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
Filter
For
For 2
For in
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
5 months ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/26.0.1 Safari/605.1.15
Browser/OS:
Safari 26 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
Filter
67621840.0 Ops/sec
For
7431169.0 Ops/sec
For 2
1408836.5 Ops/sec
For in
604075.9 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and explain what's being tested. The benchmark is comparing four different approaches to filter an array of numbers, which contains both positive and negative integers: 1. **Filter method**: This approach uses the `Array.prototype.filter()` method, which returns a new array with all elements that pass the test implemented by the provided function. 2. **For loop**: This approach uses a traditional for loop to iterate over the array and push elements that meet the condition into a new array (`farr`). 3. **For loop (shortened version)**: This is similar to the previous loop, but it's more concise by omitting the `len` variable. 4. **For...in loop**: This approach uses the `for...in` statement to iterate over the array properties and push elements that meet the condition into a new array (`farr`). **Pros and Cons of each approach:** * **Filter method**: Pros - concise, efficient, and easy to read. Cons - may have performance issues if used with large arrays or in older browsers. * **For loop**: Pros - widely supported, can be optimized for specific use cases. Cons - less readable than filter or other approaches. * **For loop (shortened version)**: Similar pros and cons as the previous loop, but more concise. * **For...in loop**: Pros - simple to implement, works with arrays of any size. Cons - may not be the most efficient due to its dynamic nature. **Library and purpose:** None are explicitly used in this benchmark. **Special JS features or syntax:** The `for...in` loop is using a deprecated feature (as of ECMAScript 2015) that can iterate over object properties, but it's still supported for compatibility reasons. In modern JavaScript, you would typically use `for...of` instead. **Other alternatives:** * **Using `map()`**: This method returns a new array with the results of applying a provided function on every element in this array. * **Using `forEach()`**: This method executes a provided function once for each array element, without returning any value. * **Native WebAssembly (WASM) functions**: These can be optimized for performance and are gaining traction in modern browsers. The current benchmark seems to be using the most straightforward approach, which is suitable for understanding the basic concept of filtering arrays. However, considering real-world scenarios or optimizing for specific use cases might require exploring alternative methods like `map()` or custom native code (WASM).
Related benchmarks:
for.. of vs forEach
Iteration through array; of vs forEach
for (i < n) vs forEach vs for...of
foreach vs for...of
forEach vs for of 7
Comments
Confirm delete:
Do you really want to delete benchmark?