1 00:00:06,790 --> 00:00:07,540 All right. 2 00:00:07,540 --> 00:00:12,790 In this video, let's talk about another method and that is map. 3 00:00:12,820 --> 00:00:18,730 For this one tool, we have used it before, so let's just move fast here. 4 00:00:18,760 --> 00:00:20,200 So come down here. 5 00:00:20,200 --> 00:00:22,600 I'm going to be as map. 6 00:00:22,600 --> 00:00:28,420 So map also loop through a record and display individual item. 7 00:00:28,420 --> 00:00:29,890 As for each. 8 00:00:29,890 --> 00:00:37,240 But the difference here is that, well, for the map, it creates a new array of which we can save it 9 00:00:37,240 --> 00:00:38,500 into a variable. 10 00:00:38,500 --> 00:00:42,040 And what we got, we can do any manipulation with it. 11 00:00:42,040 --> 00:00:44,050 We can push a new record in it. 12 00:00:44,050 --> 00:00:48,220 So that's not going to affect the original record. 13 00:00:48,220 --> 00:00:54,250 So mostly if we want to take an array and do some mathematical operation or net, the map is the best 14 00:00:54,250 --> 00:00:58,450 way to go because we're going to create a new array and a new array. 15 00:00:58,450 --> 00:01:03,280 We can do whatever we want because it's going to affect the original array. 16 00:01:03,400 --> 00:01:09,130 So for this one, let's say that I want to map through this to the end. 17 00:01:09,130 --> 00:01:14,530 And then let's say when I got the students, I want to add different data into the record. 18 00:01:14,530 --> 00:01:17,320 That's why maps comes into play. 19 00:01:17,320 --> 00:01:22,270 So the same syntax for for age, we are going to do the same thing for map. 20 00:01:22,270 --> 00:01:30,610 So because Map works on array, then what I'm going to do is that I would take the student's array on 21 00:01:30,610 --> 00:01:33,430 that I have map and then here we go. 22 00:01:33,520 --> 00:01:41,590 So inside as usual callback function and the same way we can pass in all the three agreements as we 23 00:01:41,590 --> 00:01:43,600 did four for each well. 24 00:01:43,600 --> 00:01:50,530 So for this particular function, we call it as high order function, because a function takes in other 25 00:01:50,530 --> 00:01:54,580 functions, an argument is being regarded as a higher order function. 26 00:01:54,700 --> 00:01:55,090 Great. 27 00:01:55,090 --> 00:01:58,120 So what we have here is the actual user. 28 00:01:58,150 --> 00:02:03,220 Now for map VERRASTRO we can console.log the user here. 29 00:02:03,900 --> 00:02:05,950 So when I save it, check it out. 30 00:02:05,970 --> 00:02:10,680 If we see that we have the same result as we did for for each. 31 00:02:12,030 --> 00:02:19,270 The flexibility of using map comes here when we want to make a copy of the original array. 32 00:02:19,290 --> 00:02:24,990 So in that case, instead of just console.log, we are going to return the. 33 00:02:26,060 --> 00:02:28,580 Individual users here like that. 34 00:02:28,580 --> 00:02:32,390 And then I'm going to assign to a variable cause. 35 00:02:32,390 --> 00:02:39,010 Say new students like that new student is equal to that. 36 00:02:39,020 --> 00:02:48,470 So for this one, for each loop map is going towards populate individual user into a new array for new 37 00:02:48,470 --> 00:02:50,780 students variable as we see over there. 38 00:02:50,900 --> 00:02:57,170 So with this one, if I console.log new student, you're going to see that I'm going to have an array 39 00:02:57,170 --> 00:03:00,010 of new student and that is it. 40 00:03:00,020 --> 00:03:07,730 So for this one, I can go ahead and say that, hey, now I want to push new student to the new student's 41 00:03:07,730 --> 00:03:08,440 array. 42 00:03:08,450 --> 00:03:13,370 So I'm going to take the new student dot push and just push. 43 00:03:13,370 --> 00:03:22,430 One student's name is equal to Emmanuel and then the next age is equal to 31 years old. 44 00:03:22,430 --> 00:03:27,840 When I save it now and check it out now instead of four, we have five record. 45 00:03:28,070 --> 00:03:35,060 If I try to console.log the original array, let's see what we have that the students array. 46 00:03:35,090 --> 00:03:36,020 Check it out. 47 00:03:36,170 --> 00:03:38,300 The first one has five records. 48 00:03:38,330 --> 00:03:43,190 This is the array that we copied and we push a new student into it. 49 00:03:43,640 --> 00:03:46,280 And this is the original student's record. 50 00:03:46,280 --> 00:03:48,710 We still have four students in it. 51 00:03:48,920 --> 00:03:49,610 That is it. 52 00:03:49,610 --> 00:03:56,240 And one good thing about MAP also is that we can retrieve certain parts of the user that we want. 53 00:03:56,240 --> 00:04:03,260 So let's say that I in my application, I don't want to display, let's say the person's name and age, 54 00:04:03,260 --> 00:04:06,500 but I only need the name only or age only. 55 00:04:06,800 --> 00:04:09,560 So in this case, map shine over here too. 56 00:04:09,560 --> 00:04:18,890 So in this one, if I want to retain the name, only then can I be user or student Dot's name. 57 00:04:19,130 --> 00:04:25,100 Okay, so this one, if I have it, let's see if we see that we have what a race of names. 58 00:04:25,100 --> 00:04:28,640 But the last one here is what I added as an object. 59 00:04:28,640 --> 00:04:34,850 So in this case, because we are retrieving all name, you're going to have single values in the array. 60 00:04:34,850 --> 00:04:38,510 Therefore, the way I'm pushing this data is going to be wrong. 61 00:04:38,510 --> 00:04:41,150 So in this case I'm going to remove this one. 62 00:04:41,150 --> 00:04:49,820 The here is that and even remove the object and the name here and just push in the name only. 63 00:04:49,820 --> 00:04:52,160 And when I save it, let's see. 64 00:04:52,160 --> 00:04:54,260 Now they have the same format. 65 00:04:54,260 --> 00:04:57,050 That's a beauty of map. 66 00:04:57,050 --> 00:05:04,130 So for a map two, we can change, like I said, for the newly array, we can change it in methods or 67 00:05:04,130 --> 00:05:04,580 net.