Javascript for () loop variants

Question

I'm creating this element with these attributes:

var x = document.createElement('x');
x.setAttribute('ha','1');
x.setAttribute('he','2');
x.setAttribute('hi','3');

And then I loop through it using these 2 forms, getting different output each time:

>>>for(var i in x.attributes) console.log(x.attributes[i]);
ha="1"
he="2"
hi="3"
3
item()
getNamedItem()
setNamedItem()
removeNamedItem()
getNamedItemNS()
setNamedItemNS()
removeNamedItemNS()

And the other one:

>>>for(var i=0;i<x.attributes.length;i++) console.log(x.attributes[i]);
ha="1"
he="2"
hi="3"

So, shouldn't this be giving the same result ? Why not ?

See stackoverflow.com/a/4261096/119271

Douglas
– Douglas

2012-11-14 10:55:52 +00:00
Commented Nov 14, 2012 at 10:55 — Douglas
– Douglas, Commented Nov 14, 2012 at 10:55

score 5 · Accepted Answer · 2012-11-14 11:03:55Z

5

This is because you are getting everything from the prototype as well. Use hasOwnProperty to only iterate over those properties that you have set:

for(var i in x.attributes){ 
    if (x.hasOwnProperty(i)) {
        console.log(x.attributes[i]);
    }
}

edited Nov 14, 2012 at 11:03

answered Nov 14, 2012 at 10:55

user1726343

Sign up to request clarification or add additional context in comments.

5 Comments

JustAPoring Over a year ago

What a wonderful example on when to NOT use a ternary oprator. Or, should I say, how to use it in a wrong way.

user1726343 Over a year ago

@alro Oh does the code break? I didn't test it. I only used the ternary to make it obvious where he would include the test in his own logic.

JustAPoring Over a year ago

No, but it's simply not the intended usage of it. If you're just gonna do something ridiculous like :void(0), you're better off just using an if.

JustAPoring Over a year ago

Just to explain the reason behind it and not just complain: The ternary operator returns a value, and it's used when you have to use either value X or Y in an expression or as a parameter. If you don't actually use the returned value, the if is the more intended and gentle way to do it. Either way, +1 for editing :)

user1726343 Over a year ago

@alro I know, you should see how gruesomely I misuse the constructs in other C like languages. :P Thanks for the tip.

David Thomas · Accepted Answer · 2012-11-14 11:01:21Z

5

The for...in approach iterates through all the properties of an object, including the 'native' properties. To restrict the output to those properties you've defined:

for (var i in obj) {
    if (obj.hasOwnProperty(i)) {
        console.log(i);
    }
}

References:

edited Nov 14, 2012 at 11:01

answered Nov 14, 2012 at 10:55

David Thomas

254k53 gold badges382 silver badges421 bronze badges

Collectives™ on Stack Overflow

Javascript for () loop variants

2 Answers 2

5 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related