Looping through 'layered' javascript dictionary

Question

I'm trying to create a dictionary (I think that's the best option...) for setting up a type of address book. The idea is to return something like

contacts = {"Bruce Wayne":{"phone number":'123-456-7890', "car":"All of them"}, "Alfred":{"phone number" :'987-654-3210', "car": "limo"}, "Clark Kent":{"phone number":'951-753-8520', "car":"None, flying works."}}

This works. I can do say console.log(contacts["Bruce Wayne"]) and it returns:

{ 'phone number': '123-456-7890', car: 'All of them' }

Doing console.log(contacts["Bruce Wayne"]["phone number"]) correctly returns

123-456-7890

However, I can't figure out how to loop through each person, and then each person's phone number and car.

Using this:

for (const[key, value] of Object.entries(contacts)){
    console.log(contacts[key]);
}

just returns

[object Object]
[object Object]
[object Object]

I'm trying to get (psuedo code)

[First key], [key] is [value], [key] is [value]

Bruce Wayne, phone number is 123-456-7890, car is All of them
Alfred, phone number is 987-654-3210, car is limo

Edit: I also tried

for (var person in contacts){
    console.log(contacts[person])
}

which also returns [object Object]...

Answer 1

try this:

for (let i in contacts) {
    console.log(i + ',' + JSON.stringify(contacts[i]).replace(/\":\"/g, ' is ').replace(/["{}]/g, ''));
}

or

let contacts = { "Bruce Wayne": { "phone number": '123-456-7890', "car": "All of them" }, "Alfred": { "phone number": '987-654-3210', "car": "limo" }, "Clark Kent": { "phone number": '951-753-8520', "car": "None, flying works." } }

function consoleObj(obj, separator, attrIntro) {
    let result = '';

    for (let name in obj) {
        result += name + separator;
        for (let attr in obj[name]) {
            result += attr + attrIntro + obj[name][attr] + separator;
        }
        result += '\n';
    }

    return result;
}


console.log(consoleObj(contacts, ',', ' is '));

or this

function consoleObj(obj, separator, attrIntro) {
    return Object.keys(obj).reduce(function(result, name) {
        result += name + separator;
        Object.keys(obj[name]).forEach(function(attr) {
            result += attr + attrIntro + obj[name][attr] + separator;
        });
        result += '\n';
        return result;
    }, '');
}
console.log(consoleObj(contacts,',',' is '));

Answer 2

Your for..of loop is giving you the name and the object with the properties, so you need to change how you access the "phone number" and "car" to details['phone number'] etc...

const contacts = {"Bruce Wayne":{"phone number":'123-456-7890', "car":"All of them"}, "Alfred":{"phone number" :'987-654-3210', "car": "limo"}, "Clark Kent":{"phone number":'951-753-8520', "car":"None, flying works."}}

// join an object
const joinObject = (obj, glue = 'is', joiner = ', ') => 
  Object.keys(obj)
    .map(k => `${k} ${glue} ${obj[k]}`)
    .join(joiner)

// fixed string
for (const [name, details] of Object.entries(contacts)) {
  console.log(`${name}, phone number is ${details['phone number']}, car is ${details['car']}`);
}

// dynamic property description
for (const [name, details] of Object.entries(contacts)) {
  console.log(name + ' ' + joinObject(details))
}