This course has been updated! We now recommend you take the Complete Intro to Web Development, v3 course.
Transcript from the "Objects" Lesson
>> Brian Holt: Objects and Arrays. So so far we've been talking about numbers and strings and booleans and functions. So those are the kind of four things that we've gone over. I would say these ones are also super, super important. Objects and arrays, but what objects and arrays are, is they're kind of collections of the other things that we've been talking about.
[00:00:22] They're collections of numbers and strings and booleans and other objects and other arrays and other functions, right? They're kinda like these masses that you can conglomerate together and we will talk about that as we go through. So I have this const person equals and then curly brace this curly brace means object.
[00:00:47] Okay, so it goes from this curly brace to that curly brace down there, and everything in between is going to be part of this object, okay? And then objects are keys and values. So the first part here, name, this is the name of the key and the value that's associated with this key is Brian Holt.
[00:01:09] So if I ask for a person dot name, I'm asking for Brian Holt, right? Or if I have person dot state, then I get Washington, or favorite food taco emoji. I think I was writing this the same time I was doing the nachos, as well. So I was in Australia, and I really wanted Mexican food, and there was none to be found.
>> Brian Holt: So console.log.person, you get the whole object, right? So you can see here that it's logging out the entire object. If I do console.logperson.name, then I get just as you might imagine, Brian Holt, right? Or if I do person.favoritefood, you get taco, right? So that's what that dot means.
[00:01:55] It's like, inside of the person object, I want this key. That make sense? You can also do it this way, with a square brackets and then a string provided here. I give this to you for informational purposes, not because you necessarily are going to do it that way.
[00:02:12] But just so you know, if you see that, that's what it means, right. It does work. This is preferred. So let's just put this as name. The reason why you would occasionally use something like that, if I did something like const propName = name,
>> Brian Holt: And then here I could put propName.
>> Brian Holt: Right, so propName is name. And so here, I'm actually asking for a name, right. Or this could be state.
>> Brian Holt: Make sense? Cool.
>> Brian Holt: So those are objects. Take this even further, you can have objects within objects. So if I, yeah, I think I do it down here.
>> Brian Holt: We'll just do it right now and I think we'll eventually get there. Whether the case, I could say, I have to be up here. Make sure you have commas between each particular thing. Those are required, it's not like semi colons, these actually are required. So if I had address, then I could have another object within this.
>> Brian Holt: And we'll have street is, oops,
>> Brian Holt: Street 1234 Place. Come on, geez.
>> Brian Holt: And we'll have apartment 123, okay. So now as you might guess, the way that I get to street, is I will console out person.address,street, right? So you can have multiple ones of those chain together.
>> Brian Holt: Make sense?
>> Brian Holt: Okay.
>> Brian Holt: So why would you want to use objects? In reality, you could just have these all separated out into their own variables. While in conjunction with functions, which rhymes and it's really great and I did not do that on purpose. [LAUGH] They end up being really powerful things right?
[00:04:54] So functions suggest music and you pass in a person, right. So I suggest music to person one who is myself. And so if you age range is 25 to 35 then I say, we think you're like deaf punk you crazy millennial. [LAUGH] Otherwise, if your age range is this one, Jack, who is my father, you're obviously gonna like Johnny Cash.
[00:05:17] Which my dad does like Johnny Cash. So that's what it does there. And then otherwise it says, maybe try David Bowie or something like that, I don't know [LAUGH]. So hopefully you can kind of start seeing as, you can use these different functions together. Functions and objects and if statements to kind of get these really cool synergies of functionalities.
[00:05:37] Does that make sense?
>> Brian Holt: Okay.
>> Brian Holt: So I guess kind of, it's easy to keep all this information kind of together as one atomic unit and pass around. You don't have to pass around 13 different variables, you can pass around one variable that contains a bunch of different stuff.
[00:06:02] So objects can even have functions associated with them. So I have here a dog object. And I have here a speak method. You can tell that by the parentheses here. And so I can call dog dot speak, right? And it has a function that works with that as well.
[00:06:23] Just so you know, you can write this a bunch of different ways. I could also have put here, colon function. And that also is equivalent, but this is the new way of doing it, so I always write it this way because there are far less keystrokes.
>> Brian Holt: But those two are exactly the same, they work precisely the same way.
[00:06:47] There is one difference, it doesn't matter. [LAUGH]
>> Brian Holt: Questions about that? About having functions on objects?
>> Brian Holt: Okay.
>> Brian Holt: So we did nested objects. We talked about that. So I have me, and I have a name, right? So I console.log that. And you can also say console.log. And we'll say, me.location.city, right and I'll get out of that, Seattle.
[00:07:28] So that's how you access nested ones. And you can keep nesting, right. I could have, I don't know, thing which is another object and that contains another object and another object you can just keep going down.
>> Brian Holt: Okay, questions about objects?
>> Brian Holt: Great, so the one thing I wanna say about objects, the keys all have to be unique.
[00:08:07] So if I have name up here, I also can't have name down here.
>> Brian Holt: So what technically happens here is I have name right here, and then it immediately gets over written right here. So keys are unique, whereas values do not have to be, right? So I could have another thing here called, let's just say this was San Francisco.
>> Brian Holt: And I put county here. The county that San Francisco is in is San Francisco County. So if I put San Francisco here, this is fine. So you can have multiple things have the same values, it's just that they can't have keys repeated.