Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
1
00:00:01,420 --> 00:00:03,968
Now let's learn about the Filter Method.
2
2
00:00:03,968 --> 00:00:08,910
Which, as we learned before is used to filter for elements
3
3
00:00:08,910 --> 00:00:11,313
that satisfy a certain condition.
4
4
00:00:12,237 --> 00:00:16,620
And how do we specify such a condition?
5
5
00:00:16,620 --> 00:00:21,100
Well, you guessed it, we use a callback function again.
6
6
00:00:21,100 --> 00:00:25,533
So, let's again work with our movements.
7
7
00:00:25,533 --> 00:00:28,253
And so now the filter array.
8
8
00:00:29,160 --> 00:00:31,910
And once again I will start with a regular function.
9
9
00:00:31,910 --> 00:00:35,972
And just like the other callback functions like in the Map,
10
10
00:00:35,972 --> 00:00:39,330
and for each, this one also gets access
11
11
00:00:39,330 --> 00:00:43,457
to the current array element as well as the index
12
12
00:00:43,457 --> 00:00:45,610
and the entire array.
13
13
00:00:45,610 --> 00:00:48,004
But let's only work with the current element here,
14
14
00:00:48,004 --> 00:00:51,223
which in filter is usually all that we need.
15
15
00:00:51,223 --> 00:00:53,899
Okay, now what we want to do here
16
16
00:00:53,899 --> 00:00:56,871
is to create an array of the deposits.
17
17
00:00:56,871 --> 00:00:59,423
So let's actually write that.
18
18
00:01:01,408 --> 00:01:05,371
So deposits and deposits are only the movements
19
19
00:01:05,371 --> 00:01:07,107
that are above zero.
20
20
00:01:07,107 --> 00:01:09,745
So we already know that. Right?
21
21
00:01:09,745 --> 00:01:13,883
Let's indeed take a look at the movements here.
22
22
00:01:16,372 --> 00:01:18,264
So here they are.
23
23
00:01:18,264 --> 00:01:23,264
And so we want to filter out these negative values.
24
24
00:01:23,510 --> 00:01:26,740
And so that condition is so that only the values
25
25
00:01:26,740 --> 00:01:30,334
that has the condition will then make it into the new array.
26
26
00:01:30,334 --> 00:01:34,190
And passing that condition means that it's true.
27
27
00:01:34,190 --> 00:01:37,825
So, we will again return something here.
28
28
00:01:37,825 --> 00:01:42,264
And here, the trick is that we return a Boolean value.
29
29
00:01:42,264 --> 00:01:44,110
And so, in this case
30
30
00:01:44,110 --> 00:01:48,163
all we need to do is to say the current movement,
31
31
00:01:49,062 --> 00:01:52,055
greater than zero and that's it.
32
32
00:01:52,055 --> 00:01:54,535
And so now only the array elements,
33
33
00:01:54,535 --> 00:01:56,838
for which this condition is true
34
34
00:01:56,838 --> 00:01:59,851
will make it into the deposits array.
35
35
00:01:59,851 --> 00:02:03,919
All the other ones will simply get filtered out.
36
36
00:02:03,919 --> 00:02:08,463
So they will not be included in this deposits array.
37
37
00:02:10,228 --> 00:02:11,295
Okay.
38
38
00:02:11,295 --> 00:02:15,960
And in fact, we only get the positive values now.
39
39
00:02:15,960 --> 00:02:17,257
Beautiful.
40
40
00:02:17,257 --> 00:02:21,620
And that's actually it, that's really simple, right?
41
41
00:02:21,620 --> 00:02:24,610
So, just as I told you if you know how to use
42
42
00:02:24,610 --> 00:02:26,105
the callback function correctly
43
43
00:02:26,105 --> 00:02:28,736
and if you know how and why it works,
44
44
00:02:28,736 --> 00:02:32,913
then all of these methods, become really really simple.
45
45
00:02:33,830 --> 00:02:38,477
And once more, I also want to use a four of loop here again
46
46
00:02:38,477 --> 00:02:41,952
so that you can appreciate the difference.
47
47
00:02:41,952 --> 00:02:44,313
And that's very simple.
48
48
00:02:46,203 --> 00:02:49,765
So, we need of course the same condition.
49
49
00:02:49,765 --> 00:02:52,351
So if the current movement is greater than zero,
50
50
00:02:52,351 --> 00:02:56,416
then we want to push the current element into a new array.
51
51
00:02:56,416 --> 00:02:59,710
So we need to create that here deposits
52
52
00:03:00,770 --> 00:03:04,734
for and start again with an empty array.
53
53
00:03:04,734 --> 00:03:08,743
And so in this case, we simply push it there.
54
54
00:03:09,878 --> 00:03:13,325
So we push the current movement.
55
55
00:03:13,325 --> 00:03:16,497
And so let's take a look now.
56
56
00:03:16,497 --> 00:03:20,580
And, as expected we get the same result.
57
57
00:03:20,580 --> 00:03:24,990
And so you could again ask, what is the big difference here?
58
58
00:03:24,990 --> 00:03:26,530
Like, what's the big deal
59
59
00:03:26,530 --> 00:03:30,043
and why not just use the four loop for everything.
60
60
00:03:30,043 --> 00:03:34,360
And the reason for that is again the push that exists
61
61
00:03:34,360 --> 00:03:38,980
in JavaScript for using more functional code, like this.
62
62
00:03:38,980 --> 00:03:41,678
But there's also a more practical implication here.
63
63
00:03:41,678 --> 00:03:44,151
And that's because we can actually chain
64
64
00:03:44,151 --> 00:03:46,080
all of these methods together.
65
65
00:03:46,080 --> 00:03:49,930
So, basically use them all one after another
66
66
00:03:49,930 --> 00:03:52,271
to build a big final result.
67
67
00:03:52,271 --> 00:03:55,740
So, a bit similar in fact to what we did here
68
68
00:03:55,740 --> 00:03:58,325
in our application, right here.
69
69
00:03:58,325 --> 00:04:01,811
But here we mixed string methods with array methods,
70
70
00:04:01,811 --> 00:04:05,139
but later on we will do, like big chains,
71
71
00:04:05,139 --> 00:04:07,264
only with array methods
72
72
00:04:07,264 --> 00:04:12,264
and that would be completely impossible using the four loop.
73
73
00:04:12,372 --> 00:04:17,002
So, that's another big advantage of using the methods
74
74
00:04:17,002 --> 00:04:19,960
instead of the regular four loop.
75
75
00:04:19,960 --> 00:04:23,610
Now, anyway I have just another small challenge
76
76
00:04:23,610 --> 00:04:27,743
for you here which is to create an array of the withdrawals.
77
77
00:04:32,081 --> 00:04:35,083
So, withdrawals like this.
78
78
00:04:35,960 --> 00:04:39,020
So I want you to create this array without looking
79
79
00:04:39,020 --> 00:04:41,090
at the code we already wrote.
80
80
00:04:41,090 --> 00:04:43,740
And so the withdrawals should only include
81
81
00:04:43,740 --> 00:04:46,650
the negative numbers too.
82
82
00:04:46,650 --> 00:04:48,380 line:15%
So pause the video now for a minute,
83
83
00:04:48,380 --> 00:04:50,933 line:15%
and please try to write this code on your own.
84
84
00:04:52,530 --> 00:04:55,283
Okay, so hopefully you did that.
85
85
00:04:56,690 --> 00:05:00,902
And so, it is movements and again dot filter.
86
86
00:05:00,902 --> 00:05:03,482
And now I will use an arrow function here.
87
87
00:05:03,482 --> 00:05:07,090
So I will leave this one with the regular one
88
88
00:05:07,090 --> 00:05:08,563
and now an arrow function.
89
89
00:05:10,890 --> 00:05:15,862
Okay. And now, more of or less than zero, and that's it.
90
90
00:05:15,862 --> 00:05:18,991
This is our condition and never forget
91
91
00:05:18,991 --> 00:05:22,063
that this one is actually returned here.
92
92
00:05:23,760 --> 00:05:27,013
So again, it is like having return written here.
93
93
00:05:28,680 --> 00:05:31,310
And so this is why this works
94
94
00:05:32,481 --> 00:05:34,752
lets log it to the console
95
95
00:05:34,752 --> 00:05:39,400
and yeah, only the negative numbers remain now.
96
96
00:05:39,400 --> 00:05:43,780
All the positive ones get the result of false
97
97
00:05:43,780 --> 00:05:45,110
here in this condition.
98
98
00:05:45,110 --> 00:05:47,143
And so therefore, they were not included
99
99
00:05:47,143 --> 00:05:49,680
in the withdrawals array.
100
100
00:05:49,680 --> 00:05:54,012
And again, these callback function here also get access
101
101
00:05:54,012 --> 00:05:57,611
to the current index and the whole array.
102
102
00:05:57,611 --> 00:06:00,000
And I will just leave it here,
103
103
00:06:00,000 --> 00:06:05,000
but I never used these in my life ever in the Filter Method.
104
104
00:06:05,531 --> 00:06:07,961
Okay, so this was the second
105
105
00:06:07,961 --> 00:06:10,502
of the data transformation methods.
106
106
00:06:10,502 --> 00:06:13,480
So that's Map, Filter and Reduce.
107
107
00:06:13,480 --> 00:06:16,953
And so, in the next video we will then talk about Reduce.
9398
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.