1
00:00:00,550 --> 00:00:03,720
You know how to create an array,
but how do you use it?

2
00:00:03,720 --> 00:00:06,040
When you want to use the value
assigned to a variable,

3
00:00:06,040 --> 00:00:09,410
the variable's name is a placeholder for
the value assigned to it.

4
00:00:09,410 --> 00:00:13,095
For example, if you wanted to display
the contents of a variable named status in

5
00:00:13,095 --> 00:00:16,677
the console, you'd provide the console.log
method of the variable name.

6
00:00:16,677 --> 00:00:21,360
However, the name of an array doesn't
quite represent a single value.

7
00:00:21,360 --> 00:00:26,110
It's a list of multiple values, or as
they are formally called array elements.

8
00:00:26,110 --> 00:00:30,630
To access a single element within
an array, you use what's called an index

9
00:00:30,630 --> 00:00:34,620
value, which is a number that indicates
the position of an element in an array.

10
00:00:35,810 --> 00:00:37,990
You can think of an array
as a numbered list.

11
00:00:37,990 --> 00:00:39,200
To get an item in the list,

12
00:00:39,200 --> 00:00:42,530
you need to call up the number
of the item you want to access.

13
00:00:42,530 --> 00:00:46,430
One really important concept to keep in
mind about arrays in JavaScript is that

14
00:00:46,430 --> 00:00:49,930
they are zero based or zero indexed.

15
00:00:49,930 --> 00:00:56,130
This means that the index of the first
element inside an array is not 1, it's 0.

16
00:00:56,130 --> 00:01:01,660
For example, this shopping list array has
three string values inside it, bread,

17
00:01:01,660 --> 00:01:03,740
butter, and honey.

18
00:01:03,740 --> 00:01:06,950
The first item bread, is at the 0 index.

19
00:01:06,950 --> 00:01:09,740
The second item butter, is at the 1 index.

20
00:01:09,740 --> 00:01:11,800
And honey is at index 2.

21
00:01:11,800 --> 00:01:13,740
To access any of those elements,

22
00:01:13,740 --> 00:01:16,920
you type the name of the array
followed by square brackets.

23
00:01:16,920 --> 00:01:20,600
For example, to log the value of
the first element, bread, to the console,

24
00:01:20,600 --> 00:01:21,440
you'd type this.

25
00:01:22,730 --> 00:01:25,610
To access a different item in the list,
change the index value.

26
00:01:27,290 --> 00:01:30,320
Let's access some of the elements
inside the planets array.

27
00:01:30,320 --> 00:01:36,470
I'll print the first item to the console,
with console.log planets, immediately

28
00:01:36,470 --> 00:01:40,940
followed by a set of square brackets,
inside the square brackets type 0.

29
00:01:40,940 --> 00:01:43,342
I'll save the file, then in the browser,

30
00:01:43,342 --> 00:01:46,631
open the JavaScript console
to see the output, Mercury.

31
00:01:46,631 --> 00:01:47,792
Back in array.js,

32
00:01:47,792 --> 00:01:52,175
I'll add a few more lines of code to
access each of the elements in the array.

33
00:01:58,893 --> 00:02:03,270
Let's also see what happens if you use
an index value that doesn't exist.

34
00:02:03,270 --> 00:02:06,630
In this case,
I'll access the item at index 4.

35
00:02:06,630 --> 00:02:11,200
This points to a fifth element in
the array, and there is no fifth element.

36
00:02:11,200 --> 00:02:12,000
So let's see what happens.

37
00:02:13,220 --> 00:02:15,960
Over in the console,
each item gets printed.

38
00:02:15,960 --> 00:02:18,770
Notice how the last element is undefined.

39
00:02:18,770 --> 00:02:22,310
That's because there isn't anything
at index 4 in this planets array.

40
00:02:24,420 --> 00:02:28,090
Now that you can create arrays and
access the values inside them,

41
00:02:28,090 --> 00:02:32,390
one of the best parts about arrays is
that you can change them programatically.

42
00:02:32,390 --> 00:02:37,030
In other words, you can add, remove, and
change array elements within your program.

43
00:02:37,030 --> 00:02:37,850
For example,

44
00:02:37,850 --> 00:02:42,150
imagine you've created a page that lists
all of the products a company sells.

45
00:02:42,150 --> 00:02:45,500
Someone visiting that page can add
products to their shopping cart.

46
00:02:45,500 --> 00:02:49,740
From a programming perspective,
an array could represent that cart.

47
00:02:49,740 --> 00:02:52,390
It's an empty array when
the user first visits the page.

48
00:02:52,390 --> 00:02:54,150
But as they add a new product to the cart,

49
00:02:54,150 --> 00:02:57,940
the program adds a new item
to the shopping cart array.

50
00:02:57,940 --> 00:03:00,830
In the next video you'll learn
how to add elements to an array

51
00:03:00,830 --> 00:03:03,570
as well as return the number
of elements inside an array.