Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

For loop Variations in javascript

In this website there are a list of for loop variations. I can understand the usage of for(var i=0, len=arr.length; i<len ;i++) loop (where arr is an array), since the arr.length isn't calculated in every step there appears to be a marginal performance gain. However what are the advantages of using the other variants? For instance, loops like

  1. for (var i=arr.length; i--;)
  2. for (var i=0, each; each = arr[i]; i++)

Are there any noticeable changes in performance when using different for loop variations? I generally use for(var i=0, len=arr.length; i<len ;i++) even for very big arrays. So I just want to know if there is something I am missing out here.

like image 279
Ashwin Krishnamurthy Avatar asked Mar 30 '12 09:03

Ashwin Krishnamurthy


2 Answers

It is widely considered that a reversed while loop

var loop = arr.length;
while( loop-- ) {
}

is the fastest loop-type available in C-like languages (this also applied to ECMAscript for quite a while, but I think all up-to-date engines are pretty even on standard loops today). ( jsperf )

Your 'variations' are actually no variations, but just different usage of the conditional statement within the for-loop (which, actually makes it a variation..doh!). Like

1) for (var i=arr.length; i--;)

Just uses the conditional part from the for-loop to do both, iterating and checking if i has a truthy value. As soon as i becomes 0 the loop will end.

2) for (var i=0, each; each = arr[i]; i++)

Here we get the element from each iteration, so we can directly access that within the loop body. This is commonly used when you are tired of always repeating arr[ n ].

You're doing well in caching the .length property before looping. As you correctly mentioned, it is faster because we don't have to access that property in every iteration. Beyond that, it's also required sometimes in DOM scripting, when dealing with 'live structures' like HTMLCollections.

like image 130
jAndy Avatar answered Oct 15 '22 08:10

jAndy


The point is when you're decrementing the iterator, you're actually comparing it to 0 rather than the length, which is faster since the "<, <=, >, >=" operators require type checks on both left and right sides of the operator to determine what comparison behaviour should be used.

the fastest loop is: (If you don't care about the order of course)

var i = arr.length
while(i--)
{
}

If you do care about the order, the method you're using is fine.

like image 30
Khodor Avatar answered Oct 15 '22 06:10

Khodor