I would like to know how to loop through a nested object without specifying keys. I mean just to take the name of the object to do the loop. Is there any method to achieve it? You can see at the bottom what I tried. It actually works, but I want to know if there is a way to do this without mentioning the keys(hero, monster)
Object to loop through:
const characterData = {
hero: {
name: "Wizard",
avatar: "images/wizard.png",
health: 60,
diceCount: 3,
currentDiceScore: []
},
monster: {
name: "Orc",
avatar: "images/orc.png",
health: 10,
diceCount: 1,
currentDiceScore: []
},
};
Object.entries(characterData.hero).forEach(([key, value]) => {
console.log(`${key}: ${value}`)
});You can first iterate over Object.values() which, in this case, are the nested objects hero, monster and so on.. using Array.prototype.forEach(), and then your code that iterates over Object.entries() again using Array.prototype.forEach()
callbackFn function is used the square brackets Destructuring assignment and inside the console.log() Template literals (Template strings):const characterData = {hero: {name: "Wizard",avatar: "images/wizard.png",health: 60,diceCount: 3,currentDiceScore: []},monster: {name: "Orc",avatar: "images/orc.png",health: 10,diceCount: 1,currentDiceScore: []},}
Object.values(characterData)
.forEach(o =>
Object.entries(o)
.forEach(([k, v]) =>
console.log(`${k}: ${v}`)))