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 JavaScript Quickstart!
You have completed JavaScript Quickstart!
Preview
While variables are one of the most important features in JavaScript, each variable can hold only one value. What if you want to keep track of multiple values? Arrays provide a way to store more than one value in a single place.
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
You'll learn that variables and
JavaScript holding key track values,
0:04
like a number or a string.
0:08
Well variables are one of the most
important features in JavaScript,
0:10
each variables can hold only one value.
0:14
What if you wanna keep
track of multiple values?
0:16
For example, the items a user puts
inside an online shopping cart, or
0:18
a list of movie titles and
their show times.
0:22
You're not going to create a variable for
every single item or movie.
0:25
There's a better way with arrays.
0:28
An array is a way of storing more
than one value in a single place.
0:30
You can think of an array as a list of
items or better yet, if a variable is like
0:34
a box, then an array is like a labeled
row holding multiple numbered boxes.
0:39
Creating an array is simple.
0:44
You start with the keyword var, like
you're creating a variable, and a name for
0:46
the array.
0:50
I'll name this one movies.
0:51
I'll add an equal sign, a pair of
square brackets, and a semi-colon.
0:53
Inside the brackets we add
a comma separated list of values.
0:59
And this could be strings, numbers or a
combination of different types of values.
1:02
I'll add a list of movie
titles as strings.
1:07
So first, I'll add the string
Avengers followed by a comma,
1:09
and the string Wonder Woman,
and a comma after that,
1:15
the string Black Panther and
the string The Last Jedi.
1:21
So to access a single value within an
array we use what's called an index value,
1:31
which is just a number that indicates
the position of that value in the list.
1:35
For example, the first item Avengers
is at the zero index word position,
1:39
the second item Wonder Woman
is at the one index,
1:45
Black Panther is at the two index,
and so on.
1:49
So to access any of those,
you type the name of the array and
1:53
call out the number of the item
you're after using square brackets.
1:56
So for example, to display the movie
title Avengers In the console,
2:00
you type console.log and pass console.log
the name of the array which is movies.
2:06
A set of square brackets and 0.
2:13
And over in the console,
we see the title Avengers in the output.
2:15
Similarly to access the last item in
this array, you would write the index 3.
2:21
And as you can see,
that outputs The Last Jedi.
2:27
There are lots and lots of ways you
can work with arrays in JavaScript.
2:31
For example, JavaScript's built in
push method let's you add one or
2:35
more items to the end of the array.
2:39
So if I type movies.push, and
2:41
inside the parenthesis add the string,
Lady Bird.
2:45
And then if I log the value of
the movies array to the console and
2:51
refresh, you'll see the movies
array in the console output.
2:56
And notice how Lady Bird was
added to the end of the array.
3:01
So now Lady Bird is at the index 4,
or you can call pop
3:04
on an array to remove the last
element from the array.
3:09
So I'll change this to movies.pop.
3:15
And now the last item of
the initial movies array,
3:21
the string The Last Jedi has
been remove from the array.
3:25
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