Preview

Start a free Courses trial
to watch this video

Sign up for Treehouse

Adding Properties Inside the Constructor Method

2:33 with Ashley Boucher

Add properties to the class blueprint using the constructor method.

Teacher's Notes
Questions?
Video Transcript
Downloads
Workspaces

Understanding "this"

Understanding how to use the this keyword can seem confusing at first. For more information, review the documentation on MDN web docs, which has some other examples.

Constructor Methods

Documentation for Constructor Methods

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

Now that we have declared the pet class and 0:00

created its constructor method, let's outline what properties that 0:02

objects of this class type will have available to them. 0:05

The object literals in the pets.js file have three properties, 0:09

animal, age, and breed. 0:14

I think you'll agree that these are appropriate to use in this pet 0:16

class as well. 0:19

If we were writing a Dog class instead, 0:21

the animal property would be pretty redundant, so we could leave that one out. 0:23

But since we're writing a Pet class, it's important to keep. 0:26

To include a property in a constructor method, 0:30

you write the word this, followed by a dot, followed by the name of the property. 0:32

If you recall, when we want to add a property to an object literal, 0:37

the syntax is the name of the object literal, followed by a dot, and 0:40

then the new property. 0:44

We use this same pattern in the constructor method, 0:46

except instead of the object name, we are using keyword this. 0:48

That's because the this keyword inside a constructor method 0:52

is referring to the object that is being created. 0:56

The keyword this has different meanings depending on where it's used, 0:59

which is often confusing, even to experienced JavaScript developers. 1:03

We don't get into the keyword this too much in this course, but 1:07

it's an important concept to know. 1:10

So I've included some links to other Treehouse courses and workshops and 1:12

some outside documentation that can help you understand this a little better. 1:15

So to add the animal property, we type this.animal. 1:20

Now we have to set it equal to a value. 1:25

But how do we know what to set it to? 1:27

Later on, when we create an instance of our Pet class, and 1:29

this constructor method is invoked, we'll pass it the value that we want to use. 1:32

That means our constructor method must be able to accept a parameter. 1:37

To do that, inside the parentheses, we type the word animal. 1:40

Now we can set our animal property equal to this parameter. 1:47

Okay, let's add our other two properties, and then we'll take a break. 1:52

First, we'll add the parameters for age and breed. 1:56

Then just like we did for the animal property, we'll create new properties for 2:01

age and breed and set them equal to the parameters. 2:05

Wow, great job. 2:17

Congrats on completing your very first constructor method. 2:19

This is is amazing progress, and I'm really proud of you. 2:22

Let's take a break here to celebrate our accomplishment, and when we come back, 2:25

we'll instantiate some pet objects and start to see the fruits of our labor. 2:28

See you soon. 2:32

You need to sign up for Treehouse in order to download course files.

Sign up

You need to sign up for Treehouse in order to set up Workspace

Sign up