First of all, never use a for in
loop to enumerate over an array. Never. Use good old for(var i = 0; i<arr.length; i++)
.
The reason behind this is the following: each object in JavaScript has a special field called prototype
. Everything you add to that field is going to be accessible on every object of that type. Suppose you want all arrays to have a cool new function called filter_0
that will filter zeroes out.
Array.prototype.filter_0 = function() {
var res = [];
for (var i = 0; i < this.length; i++) {
if (this[i] != 0) {
res.push(this[i]);
}
}
return res;
};
console.log([0, 5, 0, 3, 0, 1, 0].filter_0());
//prints [5,3,1]
This is a standard way to extend objects and add new methods. Lots of libraries do this.
However, let's look at how for in
works now:
var listeners = ["a", "b", "c"];
for (o in listeners) {
console.log(o);
}
//prints:
// 0
// 1
// 2
// filter_0
Do you see? It suddenly thinks filter_0 is another array index. Of course, it is not really a numeric index, but for in
enumerates through object fields, not just numeric indexes. So we're now enumerating through every numeric index and filter_0
. But filter_0
is not a field of any particular array object, every array object has this property now.
Luckily, all objects have a hasOwnProperty
method, which checks if this field really belongs to the object itself or if it is simply inherited from the prototype chain and thus belongs to all the objects of that type.
for (o in listeners) {
if (listeners.hasOwnProperty(o)) {
console.log(o);
}
}
//prints:
// 0
// 1
// 2
Note, that although this code works as expected for arrays, you should never, never, use for in
and for each in
for arrays. Remember that for in
enumerates the fields of an object, not array indexes or values.
var listeners = ["a", "b", "c"];
listeners.happy = "Happy debugging";
for (o in listeners) {
if (listeners.hasOwnProperty(o)) {
console.log(o);
}
}
//prints:
// 0
// 1
// 2
// happy