6. List 'em all! What is this code for?


#1

https://www.codecademy.com/en/courses/javascript-beginner-en-3bmfN/0/6?curriculum_id=506324b3a7dffd00020bf661

var friends = {};
friends.bill = {
    firstName: "Bill",
    lastName: "Gates",
    number: "(206) 555-5555",
    address: ['One Microsoft Way','Redmond','WA','98052']
};
friends.steve = {
    firstName: "Steve",
    lastName: "Jobs",
    number: "(408) 555-5555",
    address: ['1 Infinite Loop','Cupertino','CA','95014']
};

var list = function(obj) {
    for (var key in obj) {
        console.log(key);
    }
};

The code works, but I do not understand the purpose of the code above that starts with "var list...". A function called 'list' is created, and it takes an argument (in my case, 'obj'). Then, I created a for...in... loop and created a new variable called 'key', which, I suppose, is being searched for in my 'obj' argument. Then, the console prints that 'key' if it's found in 'obj'.

I admit that I looked at the answer that was provided earlier for this problem, and could not understand the purpose of this code. What is the 'obj' argument that I am supposed to feed to this function? What is the variable for between var and in (in my case, 'key'), given that I never created it earlier? Wouldn't the argument ('obj') that I feed to this function have to have something in it called 'key'?


#2

lets look at a simple function for a minute, which takes one argument x:

var test_function = function(x){
   console.log(x)
}

now, we don't know what x is yet. Doesn't matter, but now when i call the function i can pass in a parameter:

test_function(5)

and now the function will print 5 to the console. It is the same principal for your function, when you call it, you can pass an argument, or in this case a object:

var list = function(obj) {
    for (var key in obj) {
        console.log(key);
    }
};
list(friends)

woohoo, now are friends bill and steve are listed. This is the beauty of function, obj could have had any name. Lets say i had another dictionary, i could pass (or parse? not sure) it into the same function :slight_smile:

the for .. in loop does everything for you, it will loop over the items in your friends dictionary. In each run, key will hold the value. In this case it is called key, but you call it anything. You can read more about for in here


#3

Thank you, stetim94! I likely should have worded my question more precisely, as I was mostly aware of the first part of your answer, but I'm still somewhat confused about the use of key (or, whatever the programmer chooses to use there).

How does the program know that the variable key in the for...in... loop equates to each item in the friends contact list? Also, is it looping over just friends.bill and friends.steve (and not the properties within), or is it looping over the properties within (firstName, lastName, number, etc.) in the contact list?


#4

it will just loop over all the items inside the object. Those are nested inside friends.bill and friends.steve. The loop does this for you, did you read the MDN page?


#5

Thank you. Yes, I read the Mozilla Developer Network page, but was still somewhat confused. For instance, the example code on that page shows:

var obj = {a:1, b:2, c:3};

for (var prop in obj) {
console.log("obj." + prop + " = " + obj[prop]);
}

I was under the impression that the variable prop had to be declared somewhere else, such as prior to the for loop iterating through obj. However, the computer knows that prop (or whatever I put there) is each individual property in obj separated by commas, correct?


#6

Nope, created is created inside the for loop.

Very good, seems you got the hang of it :slight_smile:


#7

Thank you DrBartSch,

I had the same question. It really didn't make sense to me either.

Kind regards,

David