Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
loop-forEach
(version: 0)
Comparing performance of:
forEach vs while vs for-of
Created:
one year ago
by:
Guest
Jump to the latest result
Tests:
forEach
const numbers = Array.from({ length: 30 }, (_, i) => i + 1); const targetNumber = "3" numbers.forEach(num => { if (num % +targetNumber === 0 || num.toString().includes(targetNumber)) { console.log(`${num}!`); } else { console.log(num); } });
while
const numbers = Array.from({ length: 30 }, (_, i) => i + 1); const targetNumber = "3"; let i = 0; while (i < numbers.length) { const num = numbers[i]; if (num % +targetNumber === 0 || num.toString().includes(targetNumber)) { console.log(`${num}!`); } else { console.log(num); } i++; }
for-of
const numbers = Array.from({ length: 30 }, (_, i) => i + 1); const targetNumber = "3"; for (const num of numbers) { if (num % +targetNumber === 0 || num.toString().includes(targetNumber)) { console.log(`${num}!`); } else { console.log(num); } }
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
forEach
while
for-of
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0.0.0 Safari/537.36
Browser/OS:
Chrome 124 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
forEach
14530.5 Ops/sec
while
16670.3 Ops/sec
for-of
15225.6 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and its various components. **Benchmark Definition** The JSON object representing the benchmark is quite simple, with only four fields: * `Name`: The name of the benchmark (in this case, "loop-forEach"). * `Description`: An optional description of the benchmark (which is empty in this case). * `Script Preparation Code`: A code snippet that prepares the script for execution. In this case, it's an empty string. * `Html Preparation Code`: Another optional field for preparing HTML code, which is also empty. **Individual Test Cases** The JSON array contains three individual test cases: 1. "forEach" 2. "while" 3. "for-of" Each test case has two main components: * A `Benchmark Definition` string that represents the script to be executed. * A `Test Name` string that identifies the benchmark. These scripts perform a similar task: finding numbers in an array that meet certain conditions (i.e., divisible by 3 or containing "3" as a substring). The difference lies in the iteration method used: * `forEach`: Iterates over the array using the `forEach` loop, passing each element to the callback function. * `while`: Uses a traditional `while` loop to iterate over the array. * `for-of`: Utilizes the `for...of` loop to iterate over the array. **Comparison of Options** Here's a brief analysis of the options and their pros/cons: * **forEach**: Simple, concise code. However, it might not be as efficient as other methods since it iterates over the entire array for each element. * **while**: Allows for more control over the iteration process but can lead to more complex code. It's also less readable than `forEach` or `for-of`. * **for-of**: Provides a clean and modern way to iterate over arrays while maintaining readability. **Library Usage** There is no explicit library usage in these test cases, as they only rely on built-in JavaScript features. **Special JS Features** The `forEach`, `while`, and `for-of` loops themselves are not special JavaScript features. However: * The use of the `+` operator to convert strings to numbers (e.g., `num % +targetNumber`) is a common JavaScript idiom for ensuring type coercion. * The utilization of the `includes()` method on string values (e.g., `num.toString().includes(targetNumber)`) is another standard JavaScript feature. **Alternative Approaches** Other approaches to iterate over arrays in JavaScript include: * `Array.prototype.forEach()`: A more traditional way to iterate over an array using a callback function. * `Array.prototype.map()`, `Array.prototype.filter()`, or `Array.prototype.reduce()`: These methods can be used in conjunction with loops for more complex operations. It's worth noting that the test cases use relatively simple iterations and conditions, which might make them less representative of real-world scenarios where optimization is crucial. However, this simplicity also makes it easier to understand and compare the performance differences between these iteration methods.
Related benchmarks:
Foreach vs. for vs. while on array looping
for vs foreach vs some
for loop
ES6 forEach vs native for loop
For loop vs <Array>.forEach()
Comments
Confirm delete:
Do you really want to delete benchmark?