"Swift Collections and Control Flow" was retired on May 31, 2020.
Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed Object-Oriented JavaScript!
You have completed Object-Oriented JavaScript!
Preview
Using object literals isn't always feasible. In this video, you'll get a taste of classes: a more robust option for working with objects.
This video doesn't have any notes.
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
[MUSIC]
0:00
Welcome back to object oriented
JavaScript, Ashley here.
0:05
Now that you've mastered object literals
we're going to tackle another way to
0:08
create and work with objects
in JavaScript, called classes.
0:12
Let's dive right in.
0:15
Object literals are a handy way to
encapsulate data about something specific,
0:17
like my dog Ernie.
0:21
But they aren't great when you want to
represent multiples of something with
0:23
the same or
similar properties and methods.
0:27
See, I actually have three
other pets aside from Ernie.
0:29
I've coded up some object literals for
each of them as well.
0:33
Take a look in the pets.js
file to see them.
0:36
As you can see,
I have an object literal here for
0:39
all four of my pets, ernie,
vera, scofield, and edel.
0:43
This works, we have objects for
each pet now.
0:48
But they're all really similar.
0:51
You've probably noticed that each of these
object literals has a ton of overlap with
0:53
the others.
0:57
They have the exact same properties and
methods.
0:58
Yeah, the values for
each properties are different.
1:02
But to create these object literals,
I had to retype a lot of the same code.
1:04
And that breaks a key rule of programming.
1:09
Don't repeat yourself.
1:10
Not to mention, there's nothing
connecting these object literals.
1:12
That means to collectively add a property
or method, I have to do it for
1:15
each one individually.
1:20
That may not seem so bad now.
1:22
After all, I only have four of them,
but what if I had 10 or 20 or 100?
1:23
Imagine a scenario where I'm using objects
to manage all of the users on a web app,
1:29
or all of the books in
a library's online catalog.
1:35
It's really easy to see how difficult
things can get when you're using
1:38
object literals for
all of your object needs.
1:43
Luckily, object literals are just
the tip of the OOJS iceberg.
1:46
You needed to learn about them so you
could understand properties, methods and
1:50
object related syntax.
1:54
But now that you've mastered those
concepts, we can take your skills and
1:55
knowledge.
1:58
And apply them to more advanced and
more useful topics.
1:59
Enter JavaScript class syntax.
2:03
A class, in object oriented programming,
is a sort of blueprint for an object.
2:05
It's a specification.
2:09
When you write a class, you provide it
with a base set of properties and methods.
2:11
These properties and
2:15
methods are then available on any
object created of that class type.
2:16
Class syntax is new to
JavaScript in ES2015 and
2:21
is what developers call syntactic sugar.
2:24
JavaScript uses something called
prototypes and the syntax for creating
2:27
prototypes before ES2015 was complicated
and confusing for many developers.
2:31
[SOUND] Prototypes are less common in
classes among other programming languages.
2:36
To make object oriented
JavaScript easier to understand,
2:41
the class syntax was developed.
2:44
This syntax, while simple,
pretty, and easier to use,
2:45
has the same functionality
as the prototype syntax.
2:49
This is called syntactic sugar.
2:52
[NOISE] Even though the syntax
resembles class based programming,
2:53
we're still using
prototypes under the hood.
2:57
In the next video, we're going to
learn all about the class syntax.
3:00
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up