"for each...in" iterates a specified variable over all values of the specified object's properties.
Example:
var sum = 0;
var obj = {prop1: 5, prop2: 13, prop3: 8};
for each (var item in obj) {
sum += item;
}
print(sum); // prints "26", which is 5+13+8
Source
"for...in" iterates a specified variable over all properties of an object, in arbitrary order.
Example:
function show_props(obj, objName) {
var result = "";
for (var i in obj) {
result += objName + "." + i + " = " + obj[i] + "\n";
}
return result;
}
Source
Note 03.2013, for each... in
loops are deprecated. The 'new' syntax recommended by MDN is for... of
.
Don't use for..in
for Array iteration.
It's important to understand that Javascript Array's square bracket syntax ([]
) for accessing indicies is actually inherited from the Object
...
obj.prop === obj['prop'] // true
The for..in
structure does not work like a more traditional for..each/in
that would be found in other languages (php, python, etc...).
Javascript's for..in
is designed to iterate over the properties of an object. Producing the key of each property. Using this key combined with the Object
's bracket syntax, you can easily access the values you are after.
var obj = {
foo: "bar",
fizz: "buzz",
moo: "muck"
};
for ( var prop in obj ) {
console.log(prop); // foo / fizz / moo
console.log(obj[prop]); // bar / buzz / muck
}
And because the Array is simply an Object with sequential numeric property names (indexes) the for..in
works in a similar way, producing the numeric indicies just as it produces the property names above.
An important characteristic of the for..in
structure is that it continues to search for enumerable properties up the prototype chain. It will also iterate inherited enumerable properties. It is up to you to verify that the current property exists directly on the local object and not the prototype it is attached to with hasOwnProperty()
...
for ( var prop in obj ) {
if ( obj.hasOwnProperty(prop) ) {
// prop is actually obj's property (not inherited)
}
}
(More on Prototypal Inheritance)
The problem with using the for..in
structure on the Array type is that there is no garauntee as to what order the properties are produced... and generally speaking that is a farily important feature in processing an array.
Another problem is that it usually slower than a standard for
implementation.
Bottom Line
Using a for...in
to iterate arrays is like using the butt of a screw driver to drive a nail... why wouldn't you just use a hammer (for
)?
Best Answer
There is no difference.
JavaScript variables have only function scope, and although you can place a
var
statement in the initialisation part of afor
loop in reality the declaration is "hoisted" to the top of the scope such that when your second case examples run they're treated exactly like the first cases.EDIT: Since you updated the question after I answered, the third syntax that you added where you don't use the
var
keyword means the variablei
(ore
) will be created as a global - unless it already exists as a global in which case the existing variable will be overwritten. Global variable access is slower than local variable access.NOTE: my interpretation of the question is that it is not comparing a standard for loop with the for..in variant, it is just compared the different variable declaration methods with each other for a standard for loop, then doing the same again for a for..in loop.