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 isnt calculated every step there is marginal performance gain. However what are the advantages of using the other variants? For instance loops like
-
for (var i=arr.length; i--;)
-
for (var i=0, each; each = arr[i]; i++)
Are there any noticeable changes in performance by 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.
Source: Tips4all
It is widely considered that a reversed while loop
ReplyDeletevar 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.
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.
ReplyDeletethe 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.
According to jsperf the fastest type of loop in JavaScript is
ReplyDeletevar arr = new Array(10);
var i = 0;
while (i < arr.length) {
arr[i];
i++;
};
just ahead of (my default loop)
var arr = new Array(10);
for (var i = 0; i < arr.length; ++i) {
arr[i];
};
With this being the slowest :
var arr = new Array(10);
arr.forEach(function(x) {
x;
});
at least on Chrome 17 on OSX 10.7.3. So it seems the "default" loop is fine after all !!!
This is a poor use of a for each loop because it will fail on falsy values , breaking the loop.
ReplyDeletefor (var i=0, each; each = arr[i]; i++)
I also wouldn't use this loop ( even tough it may be faster... )
for (var i=arr.length; i--;)
It looks confusing and is less readable, you might as well write as reverse while loop then.