Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Objects Loop Through Objects Use `for in` to Loop Through an Object's Properties

Michael Rushton
Michael Rushton
7,126 Points
Posted by Michael Rushton
Michael Rushton
7,126 Points

I cant understand the ${person[prop]} part at all. Please help!

What I cant get my head around is the template literal part. In my confused brain it would make more sense if it read something along the lines of ${prop}:${person[value]} . Which I know is wrong but don't get why. Like in the example that Guil is doing, it seems like the template literal populates firstly with the keys in the object (which the for..in loop has stored as 'prop', but then followed by another ${person[prop]}, which to me looks like a path to get to the key again, not the values stored within them. I hope this makes sense. Ive really hit a dead end on this one guys. 😭

2 Answers

Jason Larson
Jason Larson
8,353 Points

You are correct in that the for...in loop is storing the key name as prop. The problem with your example of using ${person[value]} is that you aren't telling it what value to return. Person has 6 properties that have values, so you need a way to tell it which value you're looking for. You can do that 2 ways. Either person.propertyname or person['propertyname']. In both of these scenarios, it's obvious that you want the value for the propertyname, so there's no need to have to put an extra parameter on it to say that you want the value. In the video, the code does first populate the propertyname, but that is just to output that to the console to let you see which value the property is associated with. It is not using that as any sort of input into the object. Next, it is using the object['propertyname'] syntax to give you the value. Hopefully this clears things up, but if not, just reply and I'll see if I can provide more explanation.

Michael Rushton
Michael Rushton
7,126 Points
Michael Rushton
Michael Rushton
7,126 Points

Thanks so much for your answer, Jason. So if i've got this right, just by either using square brackets or dot notation after "person", that is enough to signify that you are looking for the value as opposed to the key? Because objects really only have those two types of content (either key or value), so you don't need to really write a path through to the value, its just obvious what you mean if you use the square brackets (or the object.propertyname)? Is there a time where you might choose dot notation over square brackets or is it just the same thing?

Jason Larson
Jason Larson
8,353 Points

Yes, you have it right. If you put something in brackets or in dot notation after person, you're already providing the key, so obviously you aren't looking for it, which by default means that you must be looking for the value. The dot notation and square brackets are interchangeable in many instances, though most people find that using the dot notation is easier to read and tends to be preferred as it is also shorter. Note however that there are times when you cannot use the dot notation, like in the for...in loop in the video because the system had no way to figure out what was meant when person.prop was being asked for. So, if you're getting weird or undefined results when using dot notation, try it with the square brackets.