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 Introduction to Programming Objects and Arrays Objects

Máté Végh
Máté Végh
25,607 Points
Posted by Máté Végh
Máté Végh
25,607 Points

Looking up values in nested objects

Hi,

I'm totally new to JavaSript, so I'm just exploring without any specific purposes yet.

So here is my object with a nested object:

var profile = {
    "first name": "Matt",
    "last name": "Vegetable",
    location: "Budapest, Hungary",
    favorites: {
        movies: ["Inception", "Transcendence", "The LEGO Movie"],
        toy: "LEGO"
    }
};

What I'd like to know, is if there is a way to lookup a value in a nested object like this:

var key = "...";
profile[key];

Now I know that if I'd replace the variable "key" with the actual values, it would look like this:

profile["favorites"]["movies"];

Maybe it's a silly question, I'm just curious if it would be possible. I think it's not.

2 Answers

Marcus Parsons
Marcus Parsons
15,719 Points

You can absolutely create and lookup values the same way you have done. Let's say we have your multi-layered object there, and we want to iterate through the favorite movies of the profile using variables we've made, we can do something like this:

var profile = {
    "first name": "Matt",
    "last name": "Vegetable",
    location: "Budapest, Hungary",
    favorites: {
        movies: ["Inception", "Transcendence", "The LEGO Movie"],
        toy: "LEGO"
    }
};

var primaryKey = 'favorites';
var secondaryKey = 'movies';

for (i = 0; i < profile[primaryKey][secondaryKey].length; i++) {
        console.log(profile[primaryKey][secondaryKey][i]);
      }
Máté Végh
Máté Végh
25,607 Points
Máté Végh
Máté Végh
25,607 Points

I was looking for a solution that makes it possible to use only one variable, but that was silly, because I don't even know when would I use that method. Probably never. Thanks for your comment by the way!

Marcus Parsons
Marcus Parsons
15,719 Points

No problem, Matt! Good luck!

Máté Végh
Máté Végh
25,607 Points
Máté Végh
Máté Végh
25,607 Points

What does ++ stand for? Is it the same as +=?

Marcus Parsons
Marcus Parsons
15,719 Points

++ is the same as " += 1" and -- is the same as "-= 1". I could also write "++i" instead of "i++". Since we did our iteration by one step, I went with ++ over "+= 1" but it's perfectly acceptable to write:

for (i = 0; i < profile[primaryKey][secondaryKey].length; i += 1) {
        console.log(profile[primaryKey][secondaryKey][i]);
      }

If you wanted to add any other number to i besides 1, you'd need to declare it explicitly using "+=" and the number you wanted. It's up to you which way you want to write it, as you're likely to see it many different ways out in the wild of the web! haha

Marcus Parsons
Marcus Parsons
15,719 Points

As a side note, in other languages "i++" and "++i" are functionally different, but JavaScript is lenient and treats these iterations as the same.

Máté Végh
Máté Végh
25,607 Points
Máté Végh
Máté Végh
25,607 Points

Yep, missed the number 1 from after the "+=". I get it now, thanks again!

Marcus Parsons
Marcus Parsons
15,719 Points

No problem haha If you ever have a question, you can tag me on the forums using the @ symbol as Twitter does, and I will respond to the best of my ability!

Sean T. Unwin
Sean T. Unwin
28,690 Points
Sean T. Unwin
Sean T. Unwin
28,690 Points

Although Marcus Parsons has provided a practical way to get a nested object's key value, I would like to provide some other alternatives to get the same result.

I will go with the assumption that we want to know the value of the favorite movie array.

var profile = {
    "first name": "Matt",
    "last name": "Vegetable",
    location: "Budapest, Hungary",
    favorites: {
        movies: ["Inception", "Transcendence", "The LEGO Movie"],
        toy: "LEGO"
    }
};

/* All of the following are effectively saying the same thing*/
var a = profile.favorites.movies;
var b = profile.favorites['movies'];
var c = profile['favorites']['movies'];
var d = profile[Object.keys(profile)[3]].movies;
var e = profile[Object.keys(profile)[3]]['movies'];
var f = profile.favorites[Object.keys(profile.favorites)[0]];

/* 
 * All of the above result in:
 *
 * Inception,Transcendence,The LEGO Movie
 */

// To test
console.log('a: ', a);
console.log('b: ', b);
console.log('c: ', c);
console.log('d: ', d);
console.log('e: ', e);
console.log('f: ', f);

So if you had a variable of the key name for movies, e.g. var key = 'movies'; you could use either of the methods as seen in the above for variables b, c, or e. For example:

var key = 'movies';

// Using the above's 'b` method
var favoriteMovies = profile.favorites[key];

// Result:
/*
 * Inception,Transcendence,The LEGO Movie
 */
Máté Végh
Máté Végh
25,607 Points
Máté Végh
Máté Végh
25,607 Points

Very nice! Shows that JavaScript is full of possibilities. Thanks a lot Sean!

Marcus Parsons
Marcus Parsons
15,719 Points

Thanks for the extra input, Sean!