Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
1
00:00:01,280 --> 00:00:03,040
So we're getting closer
2
2
00:00:03,040 --> 00:00:04,940
to the end of this section
3
3
00:00:04,940 --> 00:00:09,370
but there are still a couple of array methods left to learn.
4
4
00:00:09,370 --> 00:00:10,460
And so in this lecture,
5
5
00:00:10,460 --> 00:00:13,823
we're gonna look at the some and the every methods.
6
6
00:00:15,740 --> 00:00:18,860
And to start learning about the some method,
7
7
00:00:18,860 --> 00:00:21,523
let's look back at the includes method
8
8
00:00:21,523 --> 00:00:23,023
that we studied earlier.
9
9
00:00:24,440 --> 00:00:29,440
So let's log to the console here movements.includes -130.
10
10
00:00:34,340 --> 00:00:37,730
And let's also log our movements array so we can see it
11
11
00:00:39,370 --> 00:00:44,370
and so indeed, the value of -140 that we're testing here
12
12
00:00:45,330 --> 00:00:46,990
is in the array
13
13
00:00:46,990 --> 00:00:49,340
and that's why we get true here.
14
14
00:00:49,340 --> 00:00:51,700
And so we can use the includes method
15
15
00:00:51,700 --> 00:00:55,720
to test if an array includes a certain value.
16
16
00:00:55,720 --> 00:01:00,720
Now, however, we can only really test for equality, right?
17
17
00:01:01,140 --> 00:01:04,790
So basically includes here returns true
18
18
00:01:04,790 --> 00:01:09,790
if any value in the array is exactly equal to -130, right?
19
19
00:01:11,650 --> 00:01:16,180
And so again, this is essentially testing for equality
20
20
00:01:16,180 --> 00:01:20,540
but what if we wanted to test for a condition instead?
21
21
00:01:20,540 --> 00:01:23,973
And so that's where this some method comes into play.
22
22
00:01:25,720 --> 00:01:29,090
So let's say that we would like to know
23
23
00:01:29,090 --> 00:01:32,700
if there has been any deposits on this account.
24
24
00:01:32,700 --> 00:01:34,530
So in other words, we want to know
25
25
00:01:34,530 --> 00:01:38,230
if there is any positive movement in this array.
26
26
00:01:38,230 --> 00:01:40,600
So any number above zero.
27
27
00:01:40,600 --> 00:01:42,163
So how would we do that?
28
28
00:01:44,020 --> 00:01:48,530
Well, we can say movements.some
29
29
00:01:48,530 --> 00:01:52,960
and now we can specify our condition here as always.
30
30
00:01:52,960 --> 00:01:55,200
So the same callback function,
31
31
00:01:55,200 --> 00:01:58,083
which has to return either true or false.
32
32
00:01:59,690 --> 00:02:04,690
And so a deposit is a movement greater than zero.
33
33
00:02:06,990 --> 00:02:09,000
So let's call this here anyDeposits
34
34
00:02:15,160 --> 00:02:16,873
and log it to a console.
35
35
00:02:19,780 --> 00:02:22,240
And so indeed here we get true.
36
36
00:02:22,240 --> 00:02:26,070
So we have, of course, more than one deposits here.
37
37
00:02:26,070 --> 00:02:27,290
But let's say we wanted to test
38
38
00:02:27,290 --> 00:02:30,903
if there is any deposit above 5,000.
39
39
00:02:32,970 --> 00:02:35,840
So easy enough, we can check if there is something
40
40
00:02:35,840 --> 00:02:39,880
above this value and then it is false.
41
41
00:02:39,880 --> 00:02:43,773
Or we can check if these is something above 1,500.
42
42
00:02:44,800 --> 00:02:48,510
And so now it's true because there is one movement here
43
43
00:02:48,510 --> 00:02:50,083
in that condition.
44
44
00:02:50,930 --> 00:02:53,250
And so you can see that these two methods here
45
45
00:02:53,250 --> 00:02:55,280
are kind of similar.
46
46
00:02:55,280 --> 00:02:58,783
The difference is that here it checks only for equality.
47
47
00:03:00,380 --> 00:03:05,380
So equality but here, we can specify a condition now, right?
48
48
00:03:08,210 --> 00:03:10,540
So basically, this one here,
49
49
00:03:10,540 --> 00:03:14,173
we could rewrite it like this.
50
50
00:03:15,340 --> 00:03:17,213
So let's log it to the console here.
51
51
00:03:18,730 --> 00:03:22,293
So movements.some,
52
52
00:03:27,690 --> 00:03:29,130
minus 130.
53
53
00:03:29,130 --> 00:03:31,310
So this would be exactly the same.
54
54
00:03:31,310 --> 00:03:35,200
And so that's why we also get true in this one.
55
55
00:03:35,200 --> 00:03:37,920
Now, for equality, this doesn't make much sense.
56
56
00:03:37,920 --> 00:03:40,670
We could then simply use the includes method
57
57
00:03:40,670 --> 00:03:45,033
but for the case we need a condition like this one here,
58
58
00:03:46,190 --> 00:03:48,100
or really this one,
59
59
00:03:48,100 --> 00:03:52,440
then the some method is perfect for that, okay?
60
60
00:03:52,440 --> 00:03:55,700
And probably if I would have named this method,
61
61
00:03:55,700 --> 00:03:57,883
I would have called it like any.
62
62
00:03:59,140 --> 00:04:01,410
But of course, that's not the real name
63
63
00:04:01,410 --> 00:04:03,060
but that's really what it does.
64
64
00:04:03,060 --> 00:04:05,830
And so if there is any value
65
65
00:04:05,830 --> 00:04:07,950
for which this condition is true,
66
66
00:04:07,950 --> 00:04:10,810
then the some method will return true.
67
67
00:04:10,810 --> 00:04:15,220
Now, right and now let's actually use this some method
68
68
00:04:15,220 --> 00:04:18,360
to implement our missing functionality,
69
69
00:04:18,360 --> 00:04:21,023
which is to request a loan to the bank.
70
70
00:04:22,640 --> 00:04:27,240
So we will do that right here
71
71
00:04:27,240 --> 00:04:32,240
between the transfer button and the close button.
72
72
00:04:32,390 --> 00:04:34,560
And the some method will become helpful
73
73
00:04:34,560 --> 00:04:36,340
for this loan feature
74
74
00:04:36,340 --> 00:04:38,020
because our bank has a rule,
75
75
00:04:38,020 --> 00:04:40,450
which says that it only grants a loan
76
76
00:04:40,450 --> 00:04:43,170
if there at least one deposit
77
77
00:04:43,170 --> 00:04:47,590
with at least 10% of the requested loan amount.
78
78
00:04:47,590 --> 00:04:49,260
So that sounds complicated
79
79
00:04:49,260 --> 00:04:52,240
but we will implement this here in a second.
80
80
00:04:52,240 --> 00:04:55,283
So btnLoan.addEventListener click
81
81
00:04:59,860 --> 00:05:02,963
and this is now always the same as you can see.
82
82
00:05:05,770 --> 00:05:09,930
So starting by preventing the default action,
83
83
00:05:09,930 --> 00:05:12,690
so that's always gonna be the first thing
84
84
00:05:12,690 --> 00:05:16,560
and then let's have a look here at the user interface
85
85
00:05:16,560 --> 00:05:19,303
because right now it is hidden.
86
86
00:05:20,520 --> 00:05:23,163
So you see that here we only have this one field.
87
87
00:05:24,400 --> 00:05:28,297
And this field is called the inputLoanAmount, okay?
88
88
00:05:30,432 --> 00:05:34,010
So inputLoanAmount, so that's the element
89
89
00:05:34,010 --> 00:05:36,373
with this long class name.
90
90
00:05:37,440 --> 00:05:39,493
So let's copy that actually.
91
91
00:05:43,360 --> 00:05:46,253
And so let's start by actually getting that amount here.
92
92
00:05:49,420 --> 00:05:50,950
So we already know we will have
93
93
00:05:50,950 --> 00:05:54,647
to convert this input .value, okay?
94
94
00:05:58,090 --> 00:06:02,010
And now we need to create our condition here.
95
95
00:06:02,010 --> 00:06:03,040
So first of all,
96
96
00:06:03,040 --> 00:06:07,660
that amount should be greater than zero, okay?
97
97
00:06:07,660 --> 00:06:10,843
And now let's take a look here at our flow chart again.
98
98
00:06:11,950 --> 00:06:14,400
So this is what I was saying earlier.
99
99
00:06:14,400 --> 00:06:18,670
The loan is only granted if there is any deposit
100
100
00:06:18,670 --> 00:06:23,573
that's greater or equal 10% of the requested amount of loan.
101
101
00:06:26,280 --> 00:06:27,113
Now, right?
102
102
00:06:28,400 --> 00:06:30,800
So here we need now our second condition,
103
103
00:06:30,800 --> 00:06:33,100
which translates that.
104
104
00:06:33,100 --> 00:06:37,350
And so whenever we see or hear the word any,
105
105
00:06:37,350 --> 00:06:40,550
we can already know that it's probably a good use case
106
106
00:06:40,550 --> 00:06:42,990
for the some method.
107
107
00:06:42,990 --> 00:06:44,283
So let me show it to you.
108
108
00:06:45,150 --> 00:06:47,740
So as always, we get the movements
109
109
00:06:47,740 --> 00:06:52,220
from the currentAccount object .movements
110
110
00:06:52,220 --> 00:06:55,193
and now on there, we call the some method.
111
111
00:06:56,040 --> 00:06:59,060
So we already know by now
112
112
00:06:59,060 --> 00:07:02,960
how this callback function feature here works.
113
113
00:07:02,960 --> 00:07:04,700
So we get the current movement
114
114
00:07:04,700 --> 00:07:06,890
in the current iteration
115
115
00:07:06,890 --> 00:07:10,530
and now here the condition is that movement needs
116
116
00:07:10,530 --> 00:07:15,113
to be greater or equal than 10% of the amount.
117
117
00:07:16,400 --> 00:07:20,150
So that's the amount divided by 10.
118
118
00:07:20,150 --> 00:07:21,530
Okay?
119
119
00:07:21,530 --> 00:07:24,330
Or we could also do times 0.1
120
120
00:07:25,440 --> 00:07:27,890
and so that's exactly the same thing.
121
121
00:07:27,890 --> 00:07:31,290
So 0.1 here stands for 10%
122
122
00:07:31,290 --> 00:07:33,353
and so let's keep it like this.
123
123
00:07:35,310 --> 00:07:38,760
Give it a save so that it looks nicer
124
124
00:07:38,760 --> 00:07:42,840
and so yeah, if at least one of the elements
125
125
00:07:42,840 --> 00:07:46,030
in the movements array has this condition,
126
126
00:07:46,030 --> 00:07:50,950
so it's true, so basically it's greater than 10%
127
127
00:07:50,950 --> 00:07:52,690
of the requested amount,
128
128
00:07:52,690 --> 00:07:56,040
then all of this here will become true.
129
129
00:07:56,040 --> 00:07:58,380
And so the some method is perfect
130
130
00:07:58,380 --> 00:08:01,100
to be used in a condition like this.
131
131
00:08:01,100 --> 00:08:05,230
So when we need to test for something, okay?
132
132
00:08:05,230 --> 00:08:07,450
So in case this is true.
133
133
00:08:07,450 --> 00:08:10,163
Oh and I closed our flow chart again.
134
134
00:08:12,320 --> 00:08:14,670
So in case this is true,
135
135
00:08:14,670 --> 00:08:18,320
then add a positive movement to the current data
136
136
00:08:18,320 --> 00:08:19,997
and update the UI.
137
137
00:08:21,830 --> 00:08:23,423
So that's easy enough.
138
138
00:08:25,120 --> 00:08:27,320
So add the movement here.
139
139
00:08:30,671 --> 00:08:35,671
So currentAccount.movements.push
140
140
00:08:36,020 --> 00:08:39,293
and then of course, the amount that was requested.
141
141
00:08:40,810 --> 00:08:43,081
And then update the UI
142
142
00:08:43,081 --> 00:08:46,060
and for that, we already created our nice function,
143
143
00:08:46,060 --> 00:08:49,180
which does all of the functionalities in one go.
144
144
00:08:49,180 --> 00:08:50,780
And so that's updateUI
145
145
00:08:52,110 --> 00:08:56,020
and we simply pass the currentAccount into it.
146
146
00:08:56,020 --> 00:08:57,230
Okay.
147
147
00:08:57,230 --> 00:08:58,639
And that's it.
148
148
00:08:58,639 --> 00:09:03,137
Finally, let's also then clear the input field.
149
149
00:09:06,520 --> 00:09:10,363
So that value equals empty value.
150
150
00:09:11,590 --> 00:09:16,273
So we did that here and here and also up here.
151
151
00:09:20,580 --> 00:09:21,413
Okay.
152
152
00:09:22,660 --> 00:09:23,683
Let's log in.
153
153
00:09:27,230 --> 00:09:30,850
And so you see, my deposits, my largest deposit
154
154
00:09:30,850 --> 00:09:35,850
is 3,000 and so the loan that I can request
155
155
00:09:36,729 --> 00:09:41,120
can be maximum 30,000, okay?
156
156
00:09:41,120 --> 00:09:44,313
Because 3,000 here is 10% of that.
157
157
00:09:45,550 --> 00:09:47,720
So let me try something bigger.
158
158
00:09:47,720 --> 00:09:49,373
So something really huge.
159
159
00:09:51,200 --> 00:09:52,903
And so now nothing happened.
160
160
00:09:53,750 --> 00:09:55,330
And again in the real world,
161
161
00:09:55,330 --> 00:09:58,240
we would then probably get some error message
162
162
00:09:58,240 --> 00:10:01,000
somewhere here at the top or so
163
163
00:10:01,000 --> 00:10:04,010
but in this case, we're not gonna do that.
164
164
00:10:04,010 --> 00:10:06,560
Let's just try 5,000 now.
165
165
00:10:06,560 --> 00:10:10,990
And so now indeed it appeared here in our movements
166
166
00:10:10,990 --> 00:10:13,700
and also as you see, our balance was updated
167
167
00:10:14,820 --> 00:10:17,707
and also here our total income.
168
168
00:10:19,840 --> 00:10:20,800
Okay?
169
169
00:10:20,800 --> 00:10:24,080
Now let's request 50,000
170
170
00:10:25,900 --> 00:10:28,220
and so with this, you can now actually cheat.
171
171
00:10:28,220 --> 00:10:31,343
You can always create a little bit of a larger number.
172
172
00:10:32,350 --> 00:10:34,680
So now I can even request half a million
173
173
00:10:36,160 --> 00:10:39,200
and so that's cheating our algorithm,
174
174
00:10:39,200 --> 00:10:41,850
which is way too simple.
175
175
00:10:41,850 --> 00:10:45,410
But of course, this is just for testing purposes.
176
176
00:10:45,410 --> 00:10:46,243
All right.
177
177
00:10:47,410 --> 00:10:50,590
So that's how the some method works.
178
178
00:10:50,590 --> 00:10:52,203
I hope that makes sense.
179
179
00:10:53,370 --> 00:10:55,560
And so let's now actually go back here
180
180
00:10:55,560 --> 00:10:59,140
and talk about the close cousin of the some method,
181
181
00:10:59,140 --> 00:11:02,313
which is the every method.
182
182
00:11:05,310 --> 00:11:08,090
So let's write here some
183
183
00:11:10,860 --> 00:11:12,400
and every.
184
184
00:11:12,400 --> 00:11:15,510
So again, the every method is pretty similar
185
185
00:11:15,510 --> 00:11:17,070
to the some method
186
186
00:11:17,070 --> 00:11:20,240
but as you might guess, the difference between them
187
187
00:11:20,240 --> 00:11:23,000
is that every only returns true
188
188
00:11:23,000 --> 00:11:26,893
if all of the elements in the array satisfy the condition
189
189
00:11:26,893 --> 00:11:28,610
that we pass in.
190
190
00:11:28,610 --> 00:11:32,550
So in other words, if every element passes the test
191
191
00:11:32,550 --> 00:11:34,270
in our callback function,
192
192
00:11:34,270 --> 00:11:37,210
only then the every method returns true
193
193
00:11:37,210 --> 00:11:40,440
and that's why the method is called every
194
194
00:11:40,440 --> 00:11:42,160
in the first place.
195
195
00:11:42,160 --> 00:11:44,073
So let's test it out here now.
196
196
00:11:45,340 --> 00:11:49,930
So let's log to the console movements.every
197
197
00:11:52,740 --> 00:11:55,090
and then with the same condition.
198
198
00:11:55,090 --> 00:11:57,120
So let's essentially check
199
199
00:11:57,120 --> 00:12:00,590
if all of our movements here are deposits
200
200
00:12:01,600 --> 00:12:04,010
and well, indeed, they are not
201
201
00:12:04,010 --> 00:12:06,070
and that's why we get false.
202
202
00:12:06,070 --> 00:12:08,440
However, we do have one account,
203
203
00:12:08,440 --> 00:12:10,363
which only has positive moments.
204
204
00:12:12,940 --> 00:12:15,430
So let me show that to you.
205
205
00:12:15,430 --> 00:12:17,360
That's account4.
206
206
00:12:17,360 --> 00:12:21,490
So account4, all the movements are positive.
207
207
00:12:21,490 --> 00:12:23,443
So let's check it out now.
208
208
00:12:26,600 --> 00:12:29,880
So account4 and then the same condition
209
209
00:12:32,400 --> 00:12:34,240
and every is not a function
210
210
00:12:34,240 --> 00:12:35,540
and that's, of course,
211
211
00:12:35,540 --> 00:12:38,253
because we are still missing the movements array.
212
212
00:12:40,060 --> 00:12:42,900
And now it is true, all right?
213
213
00:12:42,900 --> 00:12:46,530
And so that indeed proves that the every returns true
214
214
00:12:46,530 --> 00:12:50,330
if all the elements in the array satisfy this condition
215
215
00:12:50,330 --> 00:12:52,220
because in this movements array,
216
216
00:12:52,220 --> 00:12:57,170
all of the values are in fact above zero, okay?
217
217
00:12:57,170 --> 00:12:59,710
So that's how the every method works
218
218
00:12:59,710 --> 00:13:02,953
and I think it's quite straightforward, isn't it?
219
219
00:13:03,790 --> 00:13:06,560
And now to finish, there is now more cool thing
220
220
00:13:06,560 --> 00:13:08,190
that I want to show you.
221
221
00:13:08,190 --> 00:13:09,980
So up until this point,
222
222
00:13:09,980 --> 00:13:13,280
we have always written the callback function directly
223
223
00:13:13,280 --> 00:13:17,100
as an argument into our array methods, right?
224
224
00:13:17,100 --> 00:13:21,120
However, we could also write this function separately
225
225
00:13:21,120 --> 00:13:23,823
and then pass the function as a callback.
226
226
00:13:25,100 --> 00:13:26,260
So let's say
227
227
00:13:29,560 --> 00:13:30,890
separate callback
228
228
00:13:32,120 --> 00:13:34,143
and so we could do this.
229
229
00:13:35,170 --> 00:13:38,943
So let's call deposit to this function.
230
230
00:13:42,680 --> 00:13:43,810
All right?
231
231
00:13:43,810 --> 00:13:47,930
And so this function here is exactly the same as these ones
232
232
00:13:47,930 --> 00:13:49,250
but as I just said,
233
233
00:13:49,250 --> 00:13:53,580
there is no reason for them to being directly written here
234
234
00:13:53,580 --> 00:13:55,600
in all of these array methods.
235
235
00:13:55,600 --> 00:13:57,830
We could simply write them like this
236
236
00:13:57,830 --> 00:14:00,960
and then all we would have to do
237
237
00:14:00,960 --> 00:14:05,940
is to call movements.some, for example,
238
238
00:14:05,940 --> 00:14:09,040
and then deposits or deposit.
239
239
00:14:09,040 --> 00:14:11,250
And now we could reuse the same function
240
240
00:14:11,250 --> 00:14:13,590
for all kinds of different methods
241
241
00:14:13,590 --> 00:14:17,540
that require callbacks with a true/false condition.
242
242
00:14:17,540 --> 00:14:22,173
So that could be every or filter as well.
243
243
00:14:23,800 --> 00:14:25,340
Okay?
244
244
00:14:25,340 --> 00:14:29,960
And so here is the result of these three operations
245
245
00:14:29,960 --> 00:14:32,770
and so here we get the expected results.
246
246
00:14:32,770 --> 00:14:35,960
And all by reusing the same function.
247
247
00:14:35,960 --> 00:14:37,980
Then if we wanted to change the function,
248
248
00:14:37,980 --> 00:14:42,200
all we would have to do is to change it here in one place
249
249
00:14:42,200 --> 00:14:43,580
and then all the results
250
250
00:14:43,580 --> 00:14:46,253
would become different according to that.
251
251
00:14:47,810 --> 00:14:50,980
So in practice, that's something that we do sometimes
252
252
00:14:50,980 --> 00:14:54,970
because this is, of course, better for the DRY principle.
253
253
00:14:54,970 --> 00:14:56,850
So don't repeat yourself.
254
254
00:14:56,850 --> 00:15:01,400
That's always important and it is important here as well.
255
255
00:15:01,400 --> 00:15:05,280
But anyway, with this small detour that we did here,
256
256
00:15:05,280 --> 00:15:09,193
let's now move on to learning about two more array methods.
21702
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.