1
\$\begingroup\$

I can't find out which loop is better performance than another, if you know help me.

I try about loops in js and performance in this site and this is code snippet, you can run and check.

const array1 = [];

for (let i = 0; i <= 50000; i++) {
  array1.push(i);
}


//for...
var forT0 = performance.now()

for (let element = 0; element < array1.length; element++) {
  console.log(element);
}

var forT1 = performance.now()
console.log("Call to doSomething took " + (forT1 - forT0) + " milliseconds.")



//for...in
var forInT0 = performance.now()

for (const element in array1) {
  console.log(element);
}

var forInT1 = performance.now()
console.log("Call to doSomething took " + (forInT1 - forInT0) + " milliseconds.")



//for...of
var forOfT0 = performance.now()

for (const element of array1) {
  console.log(element);
}


var forOfT1 = performance.now()
console.log("Call to doSomething took " + (forOfT1 - forOfT0) + " milliseconds.")


//forEach
var forEachT0 = performance.now()

array1.forEach(element => console.log(element));


var forEachT1 = performance.now()
console.log("Call to doSomething took " + (forEachT1 - forEachT0) + " milliseconds.")

\$\endgroup\$
1
  • 2
    \$\begingroup\$ Besides being off-topic: [for-loop] performance in javascript would that be a language characteristic of JavaScript, one measurement on one particular machine running one implementation, or a commonality of 2020 implementations? \$\endgroup\$ – greybeard May 31 '20 at 19:59
3
\$\begingroup\$

Not sure if this is a right fit for this site, as this is clearly not 'real' code, but let me give you an answer anyway.

First, in your test code, the "for" case is clearly set up incorrectly. It should look more like this:

for (let i = 0; i < array1.length; i++) {
  console.log(array1[i]);
}

Second, I don't think you are asking the right question. This is clearly a case of premature optimisation. There will be differences obviously, but in real life situations the difference will probably be marginal. It is much wiser to optimise for readability and developer comfort when writing code. Use the loop that makes most sense for you in your current situation. If you run into performance issues you can start looking at optimising then, but not before.

There are too many variables to draw conclusions from your test case. The size of the array you loop over for instance. On large arrays for will be probably be fastest (probably even a bit slower than a while loop). On small arrays a forEach is possibly faster, unless you do complex operations inside the loop. And all that is dependant on the javascript engine implementation and the hardware it runs on.

So as I said, don't worry about this stuff before you run into performance issues. And when you do, test your performance with real code and real data, not oversimplified testcode.

\$\endgroup\$
3
  • 1
    \$\begingroup\$ When it is questionable if it is a code review or not, better not to answer. \$\endgroup\$ – pacmaninbw May 31 '20 at 17:30
  • 1
    \$\begingroup\$ When I'm not sure, I prefer giving people the benefit of the doubt \$\endgroup\$ – Pevara May 31 '20 at 18:43
  • \$\begingroup\$ While that may be your personal preference, it's against site policy. \$\endgroup\$ – Mast Jun 1 '20 at 5:53
2
\$\begingroup\$

Only a single contribution:

for (var i = 0, len = myArray.length; i < len; i++) { }

A standard for loop with length caching.

\$\endgroup\$
1
  • 2
    \$\begingroup\$ When it is questionable if it is a code review or not, better not to answer. \$\endgroup\$ – pacmaninbw May 31 '20 at 17:31

Not the answer you're looking for? Browse other questions tagged or ask your own question.