JavaScript Loops Performance

[karthik085]

Hi,

Which among the following for iterating objects in JavaScript is better in terms of performance & usage?

A) property enumeration:
for (var propName in someObject) {
var value = someObject[propName];
}

B) Array protocol
for (var i=0; i<someObject.length; i++) {
var value = someObject[i];
}

C) forEach method

Can forEach method be used across various browsers and OS?

K

[Kor]

First: the loops for(a in obj) and for(var i=0;i<array.length;i++) should be used according to the nature of the collection. If the collection is an object, use first loop (because an object has no length property, or better say it has the length=0), if the collection is an array, use the second one. Thus, the speed comparison has no base.

Second: javascript 1.2 has no foreach loop. In fact it has, but the equivalent of a foreach loop is exactly the first loop you have mentioned, the loop for unordered collections (objects): for(a in obj)

Third:
- a backward loop is faster than a normal one:

for(var i=array.length-1;i>=0;--i)

- a while loop is faster than the for() loops

var i=0, a;
while(a=array[i++]){
...//do something with a
}

- a switch/case statement is faster that any loop. But for a "long" array (or an object with many properties) it is not practical.

[Fang]

forEach is supported in all latest browsers

Loop optimization tests: https://developer.mozilla.org/en/Cor.../Array/forEach
Always test using your own code and data!

[karthik085]

Thanks for the quick comments - it does make some things clear!

Regarding your third point, why is backward loop faster than normal one?

forEach details can be found in Mozilla website under this link https://developer.mozilla.org/en/Cor.../Array/forEach

I am not sure if it has been made a standard yet.

K

[Kor]

forEach is supported in all latest browsers

Not in IE7

[Kor]

I am not sure if it has been made a standard yet.

K

It is not a matter of standard, it is a matter of the javascript version. IE7 does not use the JavaScript 1.5 core (and forEach() method is a specification of JavaScript 1.5). I don't know about IE8.

[Fang]

Not in IE7

IE7 is not the latest browser

[Kor]

IE7 is not the latest browser

Well, it is one of the latest browsers. The problem is that IE7 is still in use, and something tells me it will be at least 1-2 years...

[Fang]

You might want to add a zero to the year estimate ...

[Kor]

You might want to add a zero to the year estimate ...

In fact I am one who has not switched to IE8. But I have a good reason: I am a web designer and programmer and I need to know how a page looks like in IE7 rather that IE8 - assuming that what works in IE7 will work in IE8 as well, mainly if I use a silly but useful meta tag as :

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

I could use a virtual machine to run IE7 and IE8 in parallel, but it does not worth the effort, so far

[Fang]

Use the developer toolbar (F12 key) in IE8 to switch between IE8, IE7 and quirks mode. Works quite well.

[Kor]

Use the developer toolbar (F12 key) in IE8 to switch between IE8, IE7 and quirks mode. Works quite well.

Does it? Hmm... all the "parallel IE" applications I have used so far were not quite accurate, mainly for IE6 (oh, how I hate that version...). I suppose it is the time to give that IE8 facility a try. Moreover, IE8 looks like a decent browser. Thanks for the tip.

[Fang]

'developer toolbar' is an integral part of the browser, not 3rd party.

[myrtle1908]

IE7, IE8? Luck you. Most of the corporates I produce systems for still use IE6. It really is fun how they expect widget heavy desktop like AJAX apps to run well in IE6. We show them how it runs in Chrome and they say "wow" but will they upgrade? No!