1
00:00:00,500 --> 00:00:03,560
Arrays also work closely together
with another common feature in

2
00:00:03,560 --> 00:00:05,100
JavaScript, loops.

3
00:00:05,100 --> 00:00:07,440
Loops are a powerful tool in programming.

4
00:00:07,440 --> 00:00:10,850
A loop is a way to repeat the same
actions a certain number of times.

5
00:00:10,850 --> 00:00:14,170
Now, there are many different types of
loops available to use in JavaScript.

6
00:00:14,170 --> 00:00:16,328
But they all essentially
do the same thing,

7
00:00:16,328 --> 00:00:18,613
they repeat an action
a given number of times.

8
00:00:18,613 --> 00:00:22,252
So here I'll cover two common ways
you might see loops written in modern

9
00:00:22,252 --> 00:00:23,520
JavaScript.

10
00:00:23,520 --> 00:00:25,830
First is the for-each loop.

11
00:00:25,830 --> 00:00:30,790
For-each is simply a loop that
accesses each item in an array.

12
00:00:30,790 --> 00:00:34,890
So for example, instead of manually
accessing each element in an array by

13
00:00:34,890 --> 00:00:38,510
index like I showed you earlier,
we can use a loop to do it for us.

14
00:00:38,510 --> 00:00:44,010
So we could, for instance, write a loop
that grabs each movie title in the movies

15
00:00:44,010 --> 00:00:48,630
array, and converts them into an HTML
list with links the user can click.

16
00:00:48,630 --> 00:00:52,440
To write a for-each loop, you first
put the variable name of the array,

17
00:00:54,040 --> 00:00:58,015
then .forEach and a set of parentheses.

18
00:00:58,015 --> 00:01:02,682
Inside the parentheses,
you provide for-each a function to run and

19
00:01:02,682 --> 00:01:06,220
complete once for
each item inside the array.

20
00:01:06,220 --> 00:01:08,797
You'll hear this type of function
referred to as a callback function.

21
00:01:11,270 --> 00:01:15,915
For this example, I'll write a function
that pops up an alert box for

22
00:01:15,915 --> 00:01:18,489
each movie title in the movies array.

23
00:01:18,489 --> 00:01:23,830
The function will take one parameter,
I'll call it movie.

24
00:01:23,830 --> 00:01:28,800
The parameter movie represents
the current element or

25
00:01:28,800 --> 00:01:32,100
movie title being processed
here in the array.

26
00:01:32,100 --> 00:01:36,090
And notice that there's no name after
the function keyword this time,

27
00:01:36,090 --> 00:01:37,430
because it has no name.

28
00:01:37,430 --> 00:01:39,695
It's called an anonymous function.

29
00:01:39,695 --> 00:01:43,875
You'll often use anonymous functions
to pass functions as parameters

30
00:01:43,875 --> 00:01:45,005
to another function.

31
00:01:45,005 --> 00:01:48,725
So inside the body of the function,
or between the curly braces,

32
00:01:48,725 --> 00:01:51,975
we can do whatever we want
with each item in the array.

33
00:01:51,975 --> 00:01:56,195
So I'm gonna pop up an alert dialogue
box for each movie title in the array.

34
00:01:57,725 --> 00:02:00,990
I'll type alert, and pass it movie.

35
00:02:02,380 --> 00:02:07,154
So forEach is going to call
the function passed to it,

36
00:02:07,154 --> 00:02:10,560
for each element in the movies array.

37
00:02:12,560 --> 00:02:17,170
When the function is called, a movie
title is passed into the movie argument,

38
00:02:18,510 --> 00:02:22,680
then the next, the next, and so on.

39
00:02:22,680 --> 00:02:26,950
The loop stops when it has reached
the end of the movies array, and

40
00:02:26,950 --> 00:02:30,445
there are no more movie titles
to pop up in the alert box.

41
00:02:30,445 --> 00:02:33,865
So this is just a simple example
of how loops in JavaScript

42
00:02:33,865 --> 00:02:37,635
manage the process of accessing
each element in an array for you.

43
00:02:37,635 --> 00:02:40,745
Many programmers find
for-each easier to read

44
00:02:40,745 --> 00:02:42,975
than some of the other
ways of writing loops.

45
00:02:42,975 --> 00:02:45,615
The code in a for-each
loop is easier to and

46
00:02:45,615 --> 00:02:47,695
understand, and
usually involves less codes.