Simple object properties access in a for in JS loop

Question

I'm learning OOP and am curious to discover why my code isn't looping through all the object instances and logging out the 'firstName' property - check out my demo below:

var people = {
          "person1" : {
              "firstName": "John"
              , "lastName": "Smith"
              , "age" : 25
              , "checkedin" : true
          },
          "person2" : {
              "firstName": "Nick"
              , "lastName": "Debruyne"
              , "age" : 24
              , "checkedin" : false
          }
        }
// console.log(people); // works correctly
for (let person in people) {
  // console.log(person); // works correctly
  console.log(person.firstName); // returns undefined
}

Codepen: https://codepen.io/ns91/pen/VwZoegw?editors=1111

This code should just run through each object instance and log the firstName values of each object (being 'John' and 'Nick'). Is there some rookie error I'm doing here?

Also, why does 'undefined' show in the console? I've noticed this happens for other things I log in the console, and even when successful, it still occasionally occurs. Could someone explain the process of what's going on in the browser here, or why it's showing undefined?

And is this JSON or JS? I wonder if it needs to convert into JS to be readable in JS for loops?

Thanks for any advice here.

Quotes do not matter. This is a valid JS object. You just misused the for in loop as mentioned by Jordan in the answers section. — Dragos Strugar
– Dragos Strugar, Commented Oct 1, 2019 at 22:11
Check out stackoverflow.com/questions/684672/… for other ways to do this. — Jordan Rieger
– Jordan Rieger, Commented Oct 1, 2019 at 22:14

Jordan Rieger · Accepted Answer · 2019-10-01 22:15:57Z

3

Your for ... in construct is only giving your loop the keys to each object in the people object, not the values. You need to change the line to console.log(people[person].firstName);.

The reason you were seeing undefined is that you were asking JavaScript to give you the firstName property of the key - which was just the string John or Nick, not the actual person object, and which did not have any such property.

edited Oct 1, 2019 at 22:15

answered Oct 1, 2019 at 22:10

Jordan Rieger

2,6933 gold badges32 silver badges54 bronze badges

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

Comments

German Gamboa · Accepted Answer · 2019-10-01 22:12:17Z

1

That is going to be because the for(let x in foo) loop iterates over the keys of the object. To access the value you would have to use bracket syntax like so foo[x]. Hope this helps.

answered Oct 1, 2019 at 22:12

German Gamboa

814 bronze badges

Collectives™ on Stack Overflow

Simple object properties access in a for in JS loop

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related