Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
Learn how to access and use an object's data in your program.
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
JavaScript objects let you store
multiple pieces of information
0:00
in a single variable.
0:04
In this way objects are similar to arrays.
0:05
One difference is that arrays use a number
or index value to access an array element,
0:08
while objects use a key, or
property name to access a property.
0:13
For example,
if you had an array named students,
0:18
you'd get to the first element using
an index value of 0, like this.
0:21
Let's look at an example student object
with the properties name and age.
0:25
There are two different ways to
access the value inside an object.
0:30
First, you can access the value
of the name property like this.
0:33
You use the same type of square
brackets you use with an array, but
0:37
instead of providing a number, you
provide the property's name as a string.
0:41
There's another easier and
0:45
more common way to access properties
of an object called, dot notation.
0:47
You don't need square brackets, and
0:51
you don't need to put quote marks
around the properties' name.
0:52
You add a dot after the object name
followed by the property name.
0:55
You can use either the brackets or dot
notation to access a property value, but
0:59
you'll find that dot
notation is more common,
1:02
and that's what I'll use in this course.
1:05
Since an object is used to
store properties and values,
1:08
one way you might think of an object is
like a container, or tidy package of data.
1:11
The properties are like a collection of
variables contained inside the object.
1:16
This helps keep related data group
inside one easily accessed unit,
1:20
which simplifies handling and
maintaining data.
1:24
All right, let's get back to
working with JavaScript objects.
1:27
The object you created earlier,
in object.js, has five properties with
1:30
different types of values, strings,
a number, boolean, and an array.
1:35
Let's use the data in this object.
1:39
I'll create a new variable named message
and assign it a template literal.
1:42
Inside the backticks add the message,
Hi, I'm ${}.
1:47
Remember, the ${} inserts, or
interpolates a value into a string.
1:53
Now I'll use dot notation to
access the name property and
1:59
insert its value into the string.
2:03
The name of the object is person,
so to access the value
2:06
of the name property,
I'll type person.name.
2:12
Let's log this message to
the console using console.log.
2:17
I'll save the file, and
preview index.html in the browser.
2:22
The message, Hi, I'm Edward,
displays in the console.
2:25
Notice how the object property
works just like any other variable.
2:29
Let's access another property and
display it in the string.
2:34
Between the backticks, right,
2:38
I live in ${person.city}.
2:43
This returns the message, Hi,
I'm Edward, I live in New York.
2:49
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