Check out a free preview of the full JavaScript: From First Steps to Professional course
The "Object Methods Exercise" Lesson is part of the full, JavaScript: From First Steps to Professional course featured in this preview video. Here's what you'd learn in this lesson:
Anjana provides an exercise to practice retrieving data from objects. Students are instructed to retrieve "Girl Power", the object representing Ginger Spice, "Spiceworld", and "Victoria" from the spiceGirls object.
Transcript from the "Object Methods Exercise" Lesson
[00:00:00]
>> So this is your scavenger hunt now for these objects. From the spiceGirls object, how can we retrieve these different values? The string Girl Power, the object that represents Ginger Spice aka Geri Halliwell, the string Spiceworld and the string Victoria. So let's take a moment, I'm going to split screen things, so that we can see them both at the same time.
[00:00:34]
And this is your mission, should you choose to accept it. So we have our spices array, and we have our Spice Girls object. And the question is, from the Spice Girls objects, so starting with Spice Girls dot, what do we need to type to retrieve each of those things?
[00:00:55]
Let's take a moment to try it out and we'll come back and talk about it. All righty, so let's talk about it. How can I get the string Girl Power? This one is maybe it's something that we've done a couple of times, something similar we've done. So I'm gonna start with spiceGirls and then what do I type?
[00:01:18]
Who can walk me through it, Paul?
>> .motto.
>> spiceGirls.motto, Girl Power, exactly. Let me collapse this so it's not so much in our way. So because we had our spiceGirls object and it had this motto property with a string value Girl Power. Great, okay, how about the object representing Ginger Spice?
[00:01:38]
So what I mean by this is this object right here, the second object in the spices array. How can I access that one, OJ?
>> Spices and then one and square brackets. Okay, so I could do spices [1], but how can I access it from the Spice Girls object?
[00:01:58]
>> SpiceGirls.members dot, and then one.
>> SpiceGirls.members [1], exactly. So importantly let's keep in mind that this Spices variable and spiceGirls.members both point to the same array. So remember what we talked about earlier, if we were to change one we would be changing both. All right, what about the string Spiceworld?
[00:02:26]
So this is, it's their second album. How do we get the name of their second album? Jason, you wanna walk us through this one?
>> The spiceGirls.albums and that's at index [1].
>> Yeah, so similar. In this case, we have two different arrays stored in different properties on our Spice Girls object.
[00:02:56]
We have one that's got objects and one that's got strings. Okay, now how about the string Victoria which, perhaps the most famous spice is the name of Posh Spice who is the last Spice in our Spices array [LAUGH]. So how can we get out Posh Spice's name? Yeah, Cheu.
[00:03:23]
>> SpiceGirls.members index [4].
>> [LAUGH] So yes, exactly, thank you. Because spiceGirls.members [4] is an object, we can even use the dot after those square brackets to pull out a particular property of that object. So the point here, excellent work finding all of these things in the scavenger hunt, in the Spice scavenger hunt.
[00:03:59]
The point here is that we can kind of mix and match this syntax or these, symbols, these dots and brackets and things like that, to dig into these nested objects or these complex objects that have arrays within objects, within arrays, etc. So we can use our dots and our brackets to access the things that we need.
Learn Straight from the Experts Who Shape the Modern Web
- In-depth Courses
- Industry Leading Experts
- Learning Paths
- Live Interactive Workshops