Intro to Objects | Computer Programming | Khan Academy

Intro to Objects | Computer Programming | Khan Academy


I’ve written a program to tell you juicy details about Winston, but not too much because Winston likes to keep some mystery. That’s just the Winston way. So, let’s see how I did this program. I created some variables at the top to store bits of information about him. The first variable holds a number – his age – the second variable holds a string – his eyes – the third variable holds an array of strings, which are things he likes doing, and the last two variables hold strings which describe where he was born. Then down here, I wrote each of these out using the text command and just using the variable name. And of course for the array, I have to access each element of the array using bracket notation. Cool. Now, all five of these variables are describing information about the same thing: Winston But the variables don’t know that they’re about the same thing And, you know, in Javascript, when you wanna store multiple pieces of information that are related, we have a better way of storing them that’s really cool, and it’s called an object. So what it means is that instead of 5 variables, we can have a single variable that stores all this information, which is pretty cool. Let’s try it out with Winston’s information. First, we’ll declare the variable and we’ll call it Winston. And then we put an open curly bracket – make sure it’s curly, not square – and a semicolon. So we’ve created an object but it has absolutely no information inside of it. So, to add a bit of information, we need to add properties. And each property is a key and a value. For example, age would be age: 19 Okay. And then for eyes, we’re gonna add a comma, and then eyes: “black”. Okay, cool, so now Winston has two properties inside the object. Uh, for likes, we can just go likes: and then I’ll just copy paste this from up here… and very nice. So let’s look at this. Winston has three properties Every property has a key, which is what’s on the right hand side, and a value, which is what’s on the left-hand side. For the key, it should follow the same rules as Javascript variable names. No spaces, start it with a letter, all that For the value, it can be any type of value we’ve seen so far. It could be number, it could be a string, it could be an array It could even be a boolean, so we could add isCool: true, of course In fact, the value could even be another object. So, BirthCity and BirthState. Those really are bits of information about the same thing, which is a single location. And, so I think it be make more sense if we stored it as an object. I’ll add another key, birthplace, and then for the value I’m gonna put my curly brackets again and then inside I’ll have key for city, “Mountain View”, and then state, “California”. Great! So now you can see, you can really store very rich information inside an object. All right. So now that we have this nice object that describes all this information about Winston, let’s try deleting those old separate variables that didn’t know about each other. Okay Um, uh oh! Uh so now we’ve got an error. And that’s because our text commands are referencing the old variables. We need to update them to use information from the object instead. Let’s start with just commenting out the last three so that we can do one at a time. Okay. So it says WinstonAge right now. What we need to do is replace that, so we’ll type winston, cause that’s the variable name. Notice if we just leave it like that, it says object object. That’s really gross. That’s Javascript telling us that we’re trying to turn an entire object into a string value. But instead, we really just wanna access only the age inside of it. So what we do is we put a dot, and then we write the property key, which is “age”. Tada! We have the age. We call this “dot notation,” which is where we write the variable name for the object, and then a dot, and then the property key. Okay, so we can go and do more now. Let’s uncomment this, and then instead of Winston eyes, we’ll just say winston dot eyes, and then for this one, it’ll be winston dot likes, and then winston dot likes one, and then for this last one, it’s a little more complicated because it’s an object inside an object. So we’re gonna say winston, and then dot, birthplace, but if we do that it’s still just the whole object so then we have to say dot, city. Okay let’s do this here… winston, dot, birthplace, dot, state. Tada! So it’s really cool cause you can just reach down inside the objects that are in the objects. All right Awesome. So, as you can see, objects are a great way to store a bunch of related bits of information about an object, and then be able to access it later. And when you keep going, you’re gonna find out just how awesome objects are!

3 thoughts to “Intro to Objects | Computer Programming | Khan Academy”

Leave a Reply

Your email address will not be published. Required fields are marked *