javascript for-in loop

Question

As the defination says for-in loop is used to loop through the properties of an object ,than why is it looping the element of an array?

var arr = ['a','b','c'], indexes = [];
 Array.prototype.each = function() {/*blah*/};
 for (var index in arr) {
 indexes.push(index);
}
indexes; //["0", "1", "2", "each"]

why are 0,1,2 enumerated?They are not the properties

• Hunter McMillen: var index in arr means that index will take on the index on every value in arr. To get the value you need to dereference arr with index. i.e: arr[index]
• Grijesh Chauhan: read this answer: JavaScript "For ...in" with Arrays
• user1106925: "They are not the properties" Yes, they are properties. "1" in arr; // true

Answer 1

Quote from the documentation:

for..in should not be used to iterate over an Array where index order is important. Array indexes are just enumerable properties with integer names and are otherwise identical to general Object properties. There is no guarantee that for...in will return the indexes in any particular order and it will return all enumerable properties, including those with non–integer names and those that are inherited.

Because the order of iteration is implementation dependent, iterating over an array may not visit elements in a consistent order. Therefore it is better to use a for loop with a numeric index (or Array.forEach or the non-standard for...of loop) when iterating over arrays where the order of access is important.

The key here holding the answer to your question is the following sentence:

Array indexes are just enumerable properties with integer names and are otherwise identical to general Object properties.

And the following sentence sums it up:

for..in should not be used to iterate over an Array where index order is important.

• Maizere Pathak.Nepal: if u do arr.length output is only 3 ,this means that properties are not counted right?Only argument.And how can the argument be properties ?
• Darin Dimitrov: arr.length returns only the number of elements in the array, properties are ignored. But an array could also contain properties. Consider the following code for example: var arr = [1, 2, 3]; arr.foo = 'bar';. Now arr.length will return 3 but try a for...in loop and you will see the mess it creates. You should not use for...in with arrays. Javascript is a strange beast indeed.

Answer 2

Each index in the array for which the array has an element is a property of that array. So this is basically what your array looks like behind the scenes:

>>> arr
 {
 0: 'a',
 1: 'b',
 2: 'c',
 'each': function() {}
 'length': 3
 };

These keys are enumerable which is the reason why you're seeing them in your output.

• Maizere Pathak.Nepal: if u do arr.length output is only 3 ,this means that properties are not counted right?Only argument.And how can the argument be properties ?
• David G: @Maizere No, only the elements that you give the array are counted.

Answer 3

The for in loop iterates over keys, not values. So it's giving your the array indexes 0, 1, 2 not the values.

You could do it like this but it's bad practice to use a for in on an array.

for (var index in arr) {
 indexes.push(arr[index]);
}

You should use a regular for loop

for (var i = 0; i < arr.length; i++) {
 indexes.push(arr[i]);
}

Answer 4

for...in interates over the enumerable properties of an Object. The enumerable property of Array is the index.

More information can be found here.

AMCAScript 6 defines the for...of operator which allows iteration over the values. However this has not yet been adopted.

• Jivings: @Maizere You have to do that by clicking the tick to the left. Glad I could help.

Answer 5

Yes, if you really want to use for in and not use the keys you can make the values into keys like this e.g.:

var arr = {'a':1,'b':1,'c':1};
for(var index in arr)
indexes.push(index);

same as setting arr['a']=1 etc. It's true that for..in iterates over the keys - not the values.