JavaScript for...in vs for

Question

Do you think there is a big difference in for...in and for loops? What kind of "for" do you prefer to use and why?

Let's say we have an array of associative arrays:

var myArray = [{'key': 'value'}, {'key': 'value1'}]; 

So we can iterate:

for (var i = 0; i < myArray.length; i++) 

And:

for (var i in myArray) 

I don't see a big difference. Are there any performance issues?

Answer 1

Douglas Crockford recommends in JavaScript: The Good Parts (page 24) to avoid using the for in statement.

If you use for in to loop over property names in an object, the results are not ordered. Worse: You might get unexpected results; it includes members inherited from the prototype chain and the name of methods.

Everything but the properties can be filtered out with .hasOwnProperty. This code sample does what you probably wanted originally:

for (var name in obj) {     if (Object.prototype.hasOwnProperty.call(obj, name)) {         // DO STUFF     } } 

Answer 2

The choice should be based on the which idiom is best understood.

An array is iterated using:

for (var i = 0; i < a.length; i++)    //do stuff with a[i] 

An object being used as an associative array is iterated using:

for (var key in o)   //do stuff with o[key] 

Unless you have earth shattering reasons, stick to the established pattern of usage.