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.