Looping inside an object

Question

I had encountered something unclear to me in the for loop:

var info = {
"full_name" : "John Doe",
"title" : "FrontEnd",
"links" : {
    "blog"     : "JohnDoe.com",
    "facebook" : "http://facebook.com/JohnDoe",
        "youtube"  : "http://www.youtube.com/JohnDoe",
        "twitter"  : "http://twitter.com/JohnDoe" 
    }
};

I'm looping through this object with this loop:

var output = "";

for (var key in info.links ) {
    if (info.links.hasOwnProperty(key)) {
        output += '<li>' +
        '<a href = "' + info.links[key] +
        '">' + key + '</a>' +
        '</li>';
        console.log(key);
    } 
}
var update = document.getElementById('links');
update.innerHTML = output;

And my question is, what is var key in this loop and why it works when there is no var key in scope of this loop? In this case var key becomes blog, facebook etc. inside info.links object. But why?

Consider this answer http://stackoverflow.com/questions/18465211/javascript-loop-variable-scope — Dan, Mar 31 '17 at 09:44
have a look at this http://stackoverflow.com/questions/5717126/var-or-no-var-in-javascripts-for-in-loop — Yogesh Mistry, Mar 31 '17 at 09:46

score 0 · Answer 1 · answered Mar 31 '17 at 09:44

0

var means that you're declaring a new variable, key is the name you give this variable.

Since you're looping through everthing in info.links you want to be able to call each var individually

answered Mar 31 '17 at 09:44

Shogunivar

1,237
11
18

score 0 · Answer 2 · edited May 23 '17 at 10:30

0

Look this for a sample solution. The key represents the keys of the info.links object say blog, facebook etc, thus info.links[key] represents the value i.e,

info.links["blog"] = "JohnDoe.com", 
info.links["facebook"] = "http://facebook.com/JohnDoe"

Hope this is clear.

Look this link for loop description

edited May 23 '17 at 10:30

Community

1
1

answered Mar 31 '17 at 09:49

Nitheesh

19,238
3
22
49

I know what it represents but what it is? Is it some kind of default object like event object while handling events in DOM? – Mar 31 '17 at 09:52
What object are you asking? – Nitheesh Mar 31 '17 at 09:55

score 0 · Accepted Answer · answered Mar 31 '17 at 09:57

Go thorough this https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in

for (variable in object) { ...
}

Variable "A different property name is assigned to variable on each iteration." In your case "facebook", "twitter" , etc are your property names in object

Looping inside an object

3 Answers3