1 00:00:01,130 --> 00:00:03,840 Now, before we go to that coding challenge 2 00:00:03,840 --> 00:00:05,550 that I just promised you, 3 00:00:05,550 --> 00:00:08,420 let's actually practice this array methods 4 00:00:08,420 --> 00:00:09,920 a little bit more. 5 00:00:09,920 --> 00:00:14,920 And again, that's because I had many people actually request 6 00:00:15,010 --> 00:00:18,960 yet another practice lecture of these array methods. 7 00:00:18,960 --> 00:00:21,110 And so you asked for it. 8 00:00:21,110 --> 00:00:23,523 And so here goes that lecture. 9 00:00:24,930 --> 00:00:27,820 So again, here you can already see 10 00:00:27,820 --> 00:00:29,560 the next coding challenge, 11 00:00:29,560 --> 00:00:32,880 but let's for now focus a little bit more 12 00:00:32,880 --> 00:00:35,720 on some array exercises. 13 00:00:35,720 --> 00:00:38,360 And of course we're gonna continue working on 14 00:00:38,360 --> 00:00:40,740 or accounts examples. 15 00:00:40,740 --> 00:00:43,180 And the first exercise I wanna do here 16 00:00:43,180 --> 00:00:45,310 is actually a very simple one 17 00:00:45,310 --> 00:00:48,120 in which all we want to do is to calculate 18 00:00:48,120 --> 00:00:51,930 how much has been deposited in total in the bank. 19 00:00:51,930 --> 00:00:55,563 So in all the accounts across the bank. 20 00:00:56,850 --> 00:00:58,440 So let's call that 21 00:01:00,749 --> 00:01:01,999 bankDepositSum. 22 00:01:03,986 --> 00:01:08,153 And so as always let's take our accounts variable, 23 00:01:11,020 --> 00:01:13,110 which is that array which contains 24 00:01:13,110 --> 00:01:16,250 all the four bank account objects. 25 00:01:16,250 --> 00:01:18,690 Now, the first thing that we need to do here, 26 00:01:18,690 --> 00:01:21,230 is to somehow get all these movements 27 00:01:21,230 --> 00:01:23,890 that are in these different objects, 28 00:01:23,890 --> 00:01:25,890 all into one big array 29 00:01:25,890 --> 00:01:29,430 so that we can then from there filter the deposits 30 00:01:29,430 --> 00:01:31,610 and then add them all together. 31 00:01:31,610 --> 00:01:34,020 Just like we have been doing many times 32 00:01:34,020 --> 00:01:35,990 throughout this section. 33 00:01:35,990 --> 00:01:38,170 So let's use the map method here 34 00:01:38,170 --> 00:01:41,420 because we basically want to create a new array 35 00:01:41,420 --> 00:01:43,410 out of the accounts array. 36 00:01:43,410 --> 00:01:45,990 But now we want to create an array 37 00:01:45,990 --> 00:01:48,510 which only has all the movements. 38 00:01:48,510 --> 00:01:52,530 And so, as you know, already whenever we want a new array 39 00:01:52,530 --> 00:01:54,980 with the same length as the previous one 40 00:01:54,980 --> 00:01:56,720 or as the original one, 41 00:01:56,720 --> 00:01:58,663 then we use map. 42 00:01:59,500 --> 00:02:01,850 And our callback function here, again, 43 00:02:01,850 --> 00:02:04,680 each account is called like this 44 00:02:04,680 --> 00:02:09,680 and then all we want to take out is account dot movements. 45 00:02:10,070 --> 00:02:10,910 And let's start 46 00:02:12,500 --> 00:02:15,430 by immediately taking a look here at 47 00:02:16,610 --> 00:02:17,880 this variable 48 00:02:19,470 --> 00:02:21,893 and of course, missing the log here. 49 00:02:23,230 --> 00:02:26,400 And indeed we get an array of arrays 50 00:02:27,260 --> 00:02:29,393 and here are all the different movements. 51 00:02:30,910 --> 00:02:34,350 Now, how do we get all of these values 52 00:02:34,350 --> 00:02:37,950 out of the arrays and into the main arrays? 53 00:02:37,950 --> 00:02:40,370 So whenever we have an array of a arrays, 54 00:02:40,370 --> 00:02:43,070 how can we basically remove all the values 55 00:02:43,070 --> 00:02:44,483 into the parent array? 56 00:02:45,470 --> 00:02:49,977 Well, remember that for that, we can use the flat method. 57 00:02:52,070 --> 00:02:54,290 So just like this. 58 00:02:54,290 --> 00:02:57,260 And now indeed, we got a big array 59 00:02:57,260 --> 00:03:00,740 with all of the movements that we had previously. 60 00:03:00,740 --> 00:03:03,230 However, I hope that you remember 61 00:03:03,230 --> 00:03:07,500 that we can even simplify this here, even further. 62 00:03:07,500 --> 00:03:11,380 So this map and flat, because as it turns out, 63 00:03:11,380 --> 00:03:14,880 it's very common that we want to do these two operations 64 00:03:14,880 --> 00:03:16,470 at the same time. 65 00:03:16,470 --> 00:03:18,950 And so that's the case here. 66 00:03:18,950 --> 00:03:23,180 And so instead of map, we can simply use flatMap like this 67 00:03:25,620 --> 00:03:29,910 so that will apply or a map callback function 68 00:03:29,910 --> 00:03:32,160 and then flattened the result. 69 00:03:32,160 --> 00:03:33,530 And so you will see here 70 00:03:33,530 --> 00:03:36,610 that the result looks exactly the same. 71 00:03:36,610 --> 00:03:40,793 And now all we need to do is to filter for the deposits. 72 00:03:41,970 --> 00:03:45,603 So basically for the positive values. 73 00:03:48,940 --> 00:03:51,670 And so this is nothing new at this point 74 00:03:51,670 --> 00:03:56,160 and the same for now adding them all together. 75 00:03:56,160 --> 00:03:59,040 So we have done that many times before 76 00:04:01,060 --> 00:04:03,530 so that's just write it out here 77 00:04:03,530 --> 00:04:06,093 as we already know how it works. 78 00:04:08,280 --> 00:04:10,550 And here we go. 79 00:04:10,550 --> 00:04:13,973 So the result is 25,180. 80 00:04:15,040 --> 00:04:17,720 And let's say that there are all in the same currency, 81 00:04:17,720 --> 00:04:20,773 so all dollars or all euros. 82 00:04:22,040 --> 00:04:25,730 So this part here was the same as we had done before. 83 00:04:25,730 --> 00:04:29,310 The only trick was really this part here. 84 00:04:29,310 --> 00:04:32,820 So getting all the different movements array 85 00:04:32,820 --> 00:04:34,580 out of the accounts array 86 00:04:34,580 --> 00:04:37,760 and then putting them in one flat array 87 00:04:37,760 --> 00:04:40,943 so that we could then filter and add them all together. 88 00:04:42,220 --> 00:04:45,410 Let me just add here numbers. 89 00:04:45,410 --> 00:04:48,523 So that was exercise number one. 90 00:04:50,680 --> 00:04:53,460 And now in exercise number two, 91 00:04:53,460 --> 00:04:56,410 I want to count how many deposits there have been 92 00:04:56,410 --> 00:05:00,073 in the bank with at least $1,000. 93 00:05:01,570 --> 00:05:04,613 So let's call this here, numDeposits$1000. 94 00:05:09,427 --> 00:05:13,910 And there are actually two ways of doing this. 95 00:05:13,910 --> 00:05:17,840 So I will start with the way that is probably easier. 96 00:05:17,840 --> 00:05:21,220 But then after that, I will actually save the same problem 97 00:05:21,220 --> 00:05:23,730 using the reduce method. 98 00:05:23,730 --> 00:05:27,470 So many people have asked me for advanced use cases 99 00:05:27,470 --> 00:05:29,340 of the reduced method 100 00:05:29,340 --> 00:05:33,380 because it is probably the most difficult of all of them. 101 00:05:33,380 --> 00:05:35,390 And so therefore I want to show you 102 00:05:35,390 --> 00:05:37,853 how we can basically count things, 103 00:05:38,690 --> 00:05:40,190 we're using the reduce method, 104 00:05:42,450 --> 00:05:47,283 but again, let's start with the easier solution here. 105 00:05:48,190 --> 00:05:51,200 And so if we want to count the deposits 106 00:05:51,200 --> 00:05:53,100 basically now we have to do the same thing 107 00:05:53,100 --> 00:05:54,323 as we did here. 108 00:05:55,843 --> 00:05:58,430 So we have to take all of the movements 109 00:05:58,430 --> 00:06:01,133 and put them all into one array. 110 00:06:03,390 --> 00:06:06,420 And let's lock that here already 111 00:06:08,420 --> 00:06:10,143 and here it's accounts. 112 00:06:11,320 --> 00:06:15,350 And so you see, we have a similar result to previously. 113 00:06:15,350 --> 00:06:18,370 And now what we could do here is to filter 114 00:06:18,370 --> 00:06:22,770 for movements greater than a thousand, 115 00:06:22,770 --> 00:06:24,473 like this. 116 00:06:25,550 --> 00:06:29,060 So movement greater than 1000 117 00:06:29,060 --> 00:06:31,060 which leaves us only with these. 118 00:06:31,060 --> 00:06:34,853 And then from that, you can simply take the length. 119 00:06:36,120 --> 00:06:39,600 And so this will then return five. 120 00:06:39,600 --> 00:06:43,930 And indeed this shows us that we get five deposits 121 00:06:43,930 --> 00:06:46,250 over $1,000. 122 00:06:46,250 --> 00:06:50,173 Let's say at least, so greater equal. 123 00:06:51,247 --> 00:06:52,160 All right. 124 00:06:52,160 --> 00:06:54,740 So that was one way of doing it. 125 00:06:54,740 --> 00:06:56,200 Let's comment it out 126 00:06:56,200 --> 00:06:57,980 because as I mentioned before, 127 00:06:57,980 --> 00:06:59,350 I actually want to show you 128 00:06:59,350 --> 00:07:03,530 how we could do the same thing using reduce. 129 00:07:03,530 --> 00:07:05,520 So let's get rid of this part 130 00:07:05,520 --> 00:07:08,763 because the flat map, of course, we still need that. 131 00:07:10,330 --> 00:07:14,473 We still need that array with all the values themselves. 132 00:07:15,530 --> 00:07:18,090 Now, okay, so you're already know 133 00:07:18,090 --> 00:07:21,150 that the callback function of the reduced method 134 00:07:21,150 --> 00:07:24,023 always has as a first parameter, 135 00:07:24,880 --> 00:07:26,850 basically the accumulator. 136 00:07:26,850 --> 00:07:28,750 So that's like the snowball 137 00:07:28,750 --> 00:07:32,330 onto which we want to accumulate a certain value. 138 00:07:32,330 --> 00:07:36,460 So here that is the sum which we started at zero 139 00:07:36,460 --> 00:07:38,520 and then onto that sum, 140 00:07:38,520 --> 00:07:41,580 we keep adding the current element 141 00:07:41,580 --> 00:07:44,590 and then basically in each iteration we returned 142 00:07:45,829 --> 00:07:47,720 the entire new value. 143 00:07:47,720 --> 00:07:51,313 So the previous sum plus the current value. 144 00:07:52,980 --> 00:07:55,430 So again, this year is the accumulator, 145 00:07:55,430 --> 00:07:59,250 which is like the snowball onto which we keep adding 146 00:07:59,250 --> 00:08:02,550 our snow which in this case here was the sum. 147 00:08:02,550 --> 00:08:05,430 But now in this case, our snowball, 148 00:08:05,430 --> 00:08:09,370 so our accumulator will be the number of movements 149 00:08:09,370 --> 00:08:11,163 that are greater than a thousand. 150 00:08:13,543 --> 00:08:15,790 So let's call that the count. 151 00:08:15,790 --> 00:08:18,333 And then here again, the current. 152 00:08:20,240 --> 00:08:22,800 And here we're gonna have the function body. 153 00:08:22,800 --> 00:08:26,640 And again, we will start counting at zero. 154 00:08:26,640 --> 00:08:30,140 So this initial value right here 155 00:08:30,140 --> 00:08:34,060 is just like having any value outside of a loop 156 00:08:34,060 --> 00:08:37,080 where we keep storing a new value. 157 00:08:37,080 --> 00:08:40,910 And that new value might very well be a counter 158 00:08:40,910 --> 00:08:43,970 that we only update on a certain condition 159 00:08:43,970 --> 00:08:46,593 which is exactly what we're gonna do now. 160 00:08:47,660 --> 00:08:51,810 So we will say that whenever the current value 161 00:08:51,810 --> 00:08:56,183 is greater or equal than 1000, 162 00:08:58,060 --> 00:09:02,550 then we want to return the count plus one. 163 00:09:02,550 --> 00:09:06,163 And otherwise we just want to return the count. 164 00:09:07,100 --> 00:09:12,100 So give it a save and here we get our result. 165 00:09:12,600 --> 00:09:16,370 I think it was five previously. 166 00:09:16,370 --> 00:09:20,130 Let's just take a look at the array itself 167 00:09:20,130 --> 00:09:23,900 by simply logging into the console here like this 168 00:09:23,900 --> 00:09:27,460 or we should probably even do this 169 00:09:27,460 --> 00:09:31,290 to actually see the whole array. 170 00:09:31,290 --> 00:09:34,003 And you see that it is indeed six. 171 00:09:35,440 --> 00:09:40,440 So before it was just five because I had it like this. 172 00:09:40,490 --> 00:09:43,520 And so you'll see, there is one movement with a thousand. 173 00:09:43,520 --> 00:09:46,320 And so then it is only five, 174 00:09:46,320 --> 00:09:47,733 but matters here, 175 00:09:48,570 --> 00:09:50,630 and let's get rid of this. 176 00:09:50,630 --> 00:09:54,980 So what matters is that or reduce function here works 177 00:09:54,980 --> 00:09:57,300 so we can even use reduce 178 00:09:57,300 --> 00:10:01,113 to basically simply count something in an array. 179 00:10:02,000 --> 00:10:04,110 So what's important to keep in mind 180 00:10:04,110 --> 00:10:06,890 is that we have this value here outside. 181 00:10:06,890 --> 00:10:09,820 So this accumulator, which we can use 182 00:10:09,820 --> 00:10:14,040 to reduce the array down to anything that we want. 183 00:10:14,040 --> 00:10:16,340 And in this case, it is a counter 184 00:10:16,340 --> 00:10:18,620 but it could really be anything. 185 00:10:18,620 --> 00:10:22,620 And we will actually do something even more sophisticated 186 00:10:22,620 --> 00:10:24,400 in the next example. 187 00:10:24,400 --> 00:10:27,040 But for now I want to bring your attention 188 00:10:27,040 --> 00:10:29,513 to this part here of the code. 189 00:10:30,920 --> 00:10:32,783 So this adding one. 190 00:10:34,390 --> 00:10:38,453 So you know that there is an operator for simply adding one. 191 00:10:39,490 --> 00:10:41,343 So let me duplicate this here. 192 00:10:42,673 --> 00:10:44,600 Then I will comment it out. 193 00:10:44,600 --> 00:10:49,390 And again, you know that we can simply use a plus plus here 194 00:10:49,390 --> 00:10:50,283 like this. 195 00:10:51,680 --> 00:10:56,680 Or at least we think so, because now as I reload, 196 00:10:56,750 --> 00:10:59,590 we are back to this being zero. 197 00:10:59,590 --> 00:11:02,730 So why do you think that is? 198 00:11:02,730 --> 00:11:05,650 Well, there is actually something that I didn't tell you 199 00:11:05,650 --> 00:11:08,120 about the plus plus operator. 200 00:11:08,120 --> 00:11:11,250 And so I thought that this was a good opportunity 201 00:11:11,250 --> 00:11:13,500 to maybe clear that up. 202 00:11:13,500 --> 00:11:14,340 And for that, 203 00:11:14,340 --> 00:11:18,710 let's simply do a very simple example down here. 204 00:11:18,710 --> 00:11:22,113 Let's say, let a equal 10, 205 00:11:24,520 --> 00:11:29,093 then let's log to the console a plus plus. 206 00:11:30,440 --> 00:11:35,440 And so again, you see that a is actually still 10 207 00:11:35,470 --> 00:11:38,870 even though we used this plus plus here. 208 00:11:38,870 --> 00:11:41,110 So why is that? 209 00:11:41,110 --> 00:11:43,090 Well, the plus plus operator 210 00:11:43,090 --> 00:11:45,590 does actually increment the value 211 00:11:45,590 --> 00:11:48,313 but it still returns the previous value. 212 00:11:49,760 --> 00:11:53,960 So if we now log the a again here, you will see that now 213 00:11:53,960 --> 00:11:55,273 it is indeed 11. 214 00:11:56,940 --> 00:12:00,360 So the plus plus operator did its job here. 215 00:12:00,360 --> 00:12:03,550 But the thing is that when we use it like this, 216 00:12:03,550 --> 00:12:07,653 it will still return the all to value, which here was 10. 217 00:12:09,530 --> 00:12:12,580 And so the same thing happened here. 218 00:12:12,580 --> 00:12:14,780 So we did count plus plus 219 00:12:14,780 --> 00:12:18,000 which then increased the value from zero to one. 220 00:12:18,000 --> 00:12:21,930 But the result of this expression here is still zero. 221 00:12:21,930 --> 00:12:25,500 And so zero was returned here to the next iteration. 222 00:12:25,500 --> 00:12:29,130 And therefore in the end we will always have zero. 223 00:12:29,130 --> 00:12:32,150 So like this, it's impossible to increase the value 224 00:12:32,150 --> 00:12:34,903 to one, two, three, four, five, and six. 225 00:12:36,350 --> 00:12:40,030 So this is actually something really important to understand 226 00:12:40,030 --> 00:12:42,240 about the plus plus operator 227 00:12:42,240 --> 00:12:45,380 and which I didn't make really clear before. 228 00:12:45,380 --> 00:12:48,660 Now fortunately for us, there is an easy solution 229 00:12:48,660 --> 00:12:50,850 because we can simply use the so-called 230 00:12:50,850 --> 00:12:53,023 prefixed plus plus operator. 231 00:12:54,150 --> 00:12:57,900 So we can write it before the operand. 232 00:12:57,900 --> 00:13:01,490 So plus plus a, and so now the result of this here 233 00:13:01,490 --> 00:13:03,160 should already be 11. 234 00:13:03,160 --> 00:13:05,063 So both of these should now be 11. 235 00:13:06,600 --> 00:13:09,400 And indeed they are. 236 00:13:09,400 --> 00:13:12,000 And so if we do the same thing here 237 00:13:12,000 --> 00:13:15,950 then that will now finally increment or counter here 238 00:13:15,950 --> 00:13:19,733 and we are back to seeing six as our result here. 239 00:13:20,960 --> 00:13:23,030 So let me keep this one here, actually 240 00:13:25,910 --> 00:13:27,420 just as a reference 241 00:13:27,420 --> 00:13:30,503 again because I didn't talk about this before. 242 00:13:34,230 --> 00:13:36,800 So that was exercise number two. 243 00:13:36,800 --> 00:13:39,860 And now let's go to exercise number three 244 00:13:39,860 --> 00:13:43,000 which will be an even more advanced case 245 00:13:43,000 --> 00:13:45,470 of the reduce method. 246 00:13:45,470 --> 00:13:47,340 And in this one what we're gonna do 247 00:13:47,340 --> 00:13:51,520 is to create a new object instead of just a number 248 00:13:51,520 --> 00:13:53,210 or just a string, 249 00:13:53,210 --> 00:13:55,460 because why not? 250 00:13:55,460 --> 00:13:59,010 So we already know that reduce boils down a array 251 00:13:59,010 --> 00:14:00,840 to just one value. 252 00:14:00,840 --> 00:14:05,160 And so that value might very well be an object. 253 00:14:05,160 --> 00:14:08,360 It could even be a new array as well. 254 00:14:08,360 --> 00:14:12,330 And in fact, we could use reduce to replace many 255 00:14:12,330 --> 00:14:15,030 of the other methods that we have. 256 00:14:15,030 --> 00:14:20,030 So reduce really is like the Swiss knife of array methods. 257 00:14:20,850 --> 00:14:22,623 We could use it for everything. 258 00:14:24,050 --> 00:14:27,440 Okay and with that being said, let's get started 259 00:14:27,440 --> 00:14:32,000 on this exercise of which the goal is to create an object 260 00:14:32,000 --> 00:14:34,760 which contains the sum of the deposits 261 00:14:34,760 --> 00:14:36,970 and of the withdrawals. 262 00:14:36,970 --> 00:14:40,310 So basically we want to calculate these two sums 263 00:14:40,310 --> 00:14:44,433 all at the same time, all in one go using the reduce method. 264 00:14:46,480 --> 00:14:48,520 So let me call this one sums 265 00:14:49,370 --> 00:14:51,883 and then we have to start again this way. 266 00:14:53,160 --> 00:14:57,960 So we need to get all of our movements into just one array. 267 00:14:57,960 --> 00:14:59,383 So I'm just copying that. 268 00:15:00,535 --> 00:15:03,323 And then here comes the reduce method. 269 00:15:04,330 --> 00:15:08,970 So here the first element as always, it's the accumulator 270 00:15:08,970 --> 00:15:11,400 which again, I will just call sums 271 00:15:11,400 --> 00:15:15,113 and then the second one is the current value. 272 00:15:15,970 --> 00:15:18,860 Here we will actually need a function body 273 00:15:18,860 --> 00:15:20,200 to write our code. 274 00:15:20,200 --> 00:15:22,200 And then we need the initial value 275 00:15:22,200 --> 00:15:24,890 of the accumulator as always. 276 00:15:24,890 --> 00:15:26,660 And as I was saying, 277 00:15:26,660 --> 00:15:30,280 the goal of this exercise is to create an object. 278 00:15:30,280 --> 00:15:33,340 And so our starting point then of course also needs 279 00:15:33,340 --> 00:15:34,653 to be an object. 280 00:15:36,750 --> 00:15:40,170 And this could be an empty object just like this 281 00:15:40,170 --> 00:15:44,593 or we could of course also already start filling it. 282 00:15:46,070 --> 00:15:49,830 So let's say that we want to start with deposits of zero 283 00:15:51,140 --> 00:15:53,963 and withdrawals at zero as well. 284 00:15:55,190 --> 00:15:56,023 Okay. 285 00:15:56,023 --> 00:15:57,880 And now here in our function body, 286 00:15:57,880 --> 00:16:00,440 we can simply basically ask 287 00:16:00,440 --> 00:16:05,060 if the current value is a deposit or a withdrawal. 288 00:16:05,060 --> 00:16:08,510 And once again, we do that by checking if the value 289 00:16:08,510 --> 00:16:12,260 is greater or below zero. 290 00:16:12,260 --> 00:16:13,943 So if it's greater than zero, 291 00:16:14,830 --> 00:16:17,980 and here again, using the turnery operator. 292 00:16:17,980 --> 00:16:22,030 So if it is, then we want to add the current value 293 00:16:22,030 --> 00:16:23,750 to the deposits. 294 00:16:23,750 --> 00:16:27,860 So to this value here in our object, right? 295 00:16:27,860 --> 00:16:30,130 Now here in this callback function, 296 00:16:30,130 --> 00:16:33,603 what actually is this object here. 297 00:16:34,440 --> 00:16:39,167 Well, it is simply sums, which is or accumulator, right? 298 00:16:40,130 --> 00:16:43,230 Because this year is always the initial value 299 00:16:43,230 --> 00:16:44,520 of debt accumulator. 300 00:16:44,520 --> 00:16:46,360 So of this variable. 301 00:16:46,360 --> 00:16:49,560 So we can access the deposits on sums 302 00:16:49,560 --> 00:16:54,560 that deposits and we can then add the current value 303 00:16:54,980 --> 00:16:55,853 on to that. 304 00:16:58,060 --> 00:17:01,490 And if not, so if current is below zero 305 00:17:01,490 --> 00:17:06,113 then we can add it to the withdrawals. 306 00:17:12,130 --> 00:17:14,570 Now we're actually not yet done here 307 00:17:14,570 --> 00:17:18,100 because remember that in an array function, 308 00:17:18,100 --> 00:17:20,620 the value is only automatically. 309 00:17:20,620 --> 00:17:24,640 So implicitly returned when we don't have a function body 310 00:17:24,640 --> 00:17:26,120 with curly braces. 311 00:17:26,120 --> 00:17:28,460 But right now we do here. 312 00:17:28,460 --> 00:17:32,150 Right? And so therefore we have to explicitly 313 00:17:32,150 --> 00:17:36,323 so to manually return the accumulator from the function. 314 00:17:37,660 --> 00:17:40,100 So that's how the reduce method works. 315 00:17:40,100 --> 00:17:43,000 We always have to return the accumulator 316 00:17:43,000 --> 00:17:44,670 from each iteration. 317 00:17:44,670 --> 00:17:48,490 Now, usually that happens implicitly like here 318 00:17:48,490 --> 00:17:52,913 but you already know that this here has an implicit return. 319 00:17:55,168 --> 00:17:58,730 But this is easy to forget in these cases. 320 00:17:58,730 --> 00:18:01,540 So that's why I'm emphasizing it here. 321 00:18:01,540 --> 00:18:04,630 So again, we always need to return in the end, 322 00:18:04,630 --> 00:18:06,373 the accumulator. 323 00:18:07,430 --> 00:18:10,463 And so now this should actually already work. 324 00:18:13,200 --> 00:18:14,260 So sums 325 00:18:15,270 --> 00:18:20,270 and indeed we get all the deposits and all the withdrawals 326 00:18:20,290 --> 00:18:22,780 and this value should be the same. 327 00:18:22,780 --> 00:18:24,253 Yeah, as this one here. 328 00:18:25,650 --> 00:18:28,650 But now we calculated it in a different way 329 00:18:28,650 --> 00:18:30,860 and put it directly in an object 330 00:18:30,860 --> 00:18:34,233 by using the reduce method like this. 331 00:18:35,380 --> 00:18:36,960 So that's great. 332 00:18:36,960 --> 00:18:40,600 And let's actually distract this object immediately 333 00:18:41,610 --> 00:18:44,340 so we can do this. 334 00:18:44,340 --> 00:18:47,350 So we need to now use the exact same names as here. 335 00:18:47,350 --> 00:18:51,490 So deposits and withdrawals. 336 00:18:51,490 --> 00:18:55,193 And so here we can now log these two to the console. 337 00:18:58,080 --> 00:19:00,563 And indeed, we now get these two values here. 338 00:19:01,760 --> 00:19:04,150 Now this works just fine already 339 00:19:04,150 --> 00:19:08,010 but I don't really like this part here so much. 340 00:19:08,010 --> 00:19:11,093 So let me just show you another way in which we could do it. 341 00:19:12,160 --> 00:19:14,800 So I'm just commenting it out here. 342 00:19:14,800 --> 00:19:17,730 Maybe you actually like this part here more 343 00:19:17,730 --> 00:19:20,340 but we actually have some duplication here. 344 00:19:20,340 --> 00:19:22,600 And so let's fix that. 345 00:19:22,600 --> 00:19:27,083 So this part here is very similar to this part here. 346 00:19:28,420 --> 00:19:31,893 All that changes is the deposits and the withdrawals. 347 00:19:32,740 --> 00:19:35,163 And so we can actually do this. 348 00:19:36,270 --> 00:19:38,500 So here we can now conditionally say 349 00:19:38,500 --> 00:19:40,870 that we want to select either deposits 350 00:19:40,870 --> 00:19:43,633 or withdrawals based on this condition. 351 00:19:46,680 --> 00:19:50,260 So using here the brackets notation instead 352 00:19:50,260 --> 00:19:52,380 of the dot notation. 353 00:19:52,380 --> 00:19:55,770 So in this case, we will want to get the deposits 354 00:19:57,200 --> 00:20:01,133 and otherwise the withdrawals. 355 00:20:03,840 --> 00:20:07,050 And so then it's onto this value that we want to add 356 00:20:07,050 --> 00:20:08,660 the current one. 357 00:20:08,660 --> 00:20:12,720 And here I probably have some spelling error 358 00:20:14,090 --> 00:20:16,930 and yeah so we get the same result. 359 00:20:16,930 --> 00:20:21,220 But I think that this way here is just a little bit cleaner 360 00:20:21,220 --> 00:20:25,100 but in any way, what matters here is that we were able 361 00:20:25,100 --> 00:20:30,100 to create a brand new object based on the reduced methods. 362 00:20:30,400 --> 00:20:33,660 And this can be really helpful in many situations. 363 00:20:33,660 --> 00:20:37,530 And so please take some time to review this exercise 364 00:20:37,530 --> 00:20:39,910 because this was really a great use case 365 00:20:39,910 --> 00:20:43,700 on how to use something other than a primitive value 366 00:20:43,700 --> 00:20:47,230 as the accumulator of the reduced method. 367 00:20:47,230 --> 00:20:51,093 And I would even challenge you to do this with arrays. 368 00:20:52,360 --> 00:20:55,670 So as a challenge would challenge you to recreate 369 00:20:55,670 --> 00:20:58,520 any of the examples that we did previously 370 00:20:58,520 --> 00:21:02,210 in the section with map filter and reduce 371 00:21:02,210 --> 00:21:05,590 to use only the reduce method. 372 00:21:05,590 --> 00:21:07,530 And that is totally possible. 373 00:21:07,530 --> 00:21:10,830 And so, yeah, you can try that out. 374 00:21:10,830 --> 00:21:15,080 You don't have to, and I will certainly not do that now 375 00:21:15,080 --> 00:21:18,860 but as an exercise and to get an even better understanding 376 00:21:18,860 --> 00:21:23,160 of the reduced method, you could totally do that. 377 00:21:23,160 --> 00:21:26,850 Now, this lecture is already running a bit long 378 00:21:26,850 --> 00:21:29,480 but I still have one more exercise here for you. 379 00:21:29,480 --> 00:21:32,740 So let's quickly do that. 380 00:21:32,740 --> 00:21:35,630 And this one will not have anything to do 381 00:21:35,630 --> 00:21:39,230 with the accounts now, but instead, what I want to do now 382 00:21:39,230 --> 00:21:42,950 is to create a simple function to convert any string 383 00:21:42,950 --> 00:21:45,230 to a title case. 384 00:21:45,230 --> 00:21:48,560 So title case basically means that all the words 385 00:21:48,560 --> 00:21:53,200 in a sentence are capitalized except for some of them. 386 00:21:53,200 --> 00:21:55,450 So there are some exceptions. 387 00:21:55,450 --> 00:21:57,870 Let me try an example here. 388 00:21:57,870 --> 00:22:02,230 So this is a nice title 389 00:22:03,260 --> 00:22:05,700 would be converted to this 390 00:22:05,700 --> 00:22:09,120 is and the a is lowercase. 391 00:22:09,120 --> 00:22:13,523 So this is one of the exceptions and then nice title. 392 00:22:15,900 --> 00:22:17,883 So let's get to work here. 393 00:22:18,970 --> 00:22:21,543 So convert title case, 394 00:22:22,920 --> 00:22:26,560 it's gonna be a function which takes a title 395 00:22:26,560 --> 00:22:27,863 and will then convert it. 396 00:22:28,710 --> 00:22:33,080 And so this is gonna be a nice exercise combining string 397 00:22:33,080 --> 00:22:35,963 and array methods, all in one function. 398 00:22:36,850 --> 00:22:38,250 Let me start by writing 399 00:22:39,230 --> 00:22:42,010 an example of a string here that we might 400 00:22:43,140 --> 00:22:45,033 want to capitalize. 401 00:22:46,320 --> 00:22:50,293 So convert title case, and let's actually try this one. 402 00:22:57,210 --> 00:23:00,380 Let's also try some more, 403 00:23:00,380 --> 00:23:05,380 this is a long title, 404 00:23:05,650 --> 00:23:08,820 but not too long. 405 00:23:08,820 --> 00:23:12,520 So just to see what happens here 406 00:23:12,520 --> 00:23:16,100 and also just to put some of the different exception words 407 00:23:16,100 --> 00:23:17,570 in there 408 00:23:17,570 --> 00:23:18,403 and 409 00:23:20,430 --> 00:23:25,430 is another title with an example 410 00:23:29,550 --> 00:23:31,223 like this. 411 00:23:33,890 --> 00:23:38,223 And so now we can worry about writing our function here. 412 00:23:39,730 --> 00:23:43,000 And let's start by creating an array, 413 00:23:43,000 --> 00:23:45,310 which contains the exceptions. 414 00:23:45,310 --> 00:23:48,330 So the words that should not be capitalized 415 00:23:48,330 --> 00:23:52,053 and the exceptions are a, n, 416 00:23:53,890 --> 00:23:54,723 the, 417 00:23:56,700 --> 00:23:58,360 but 418 00:23:58,360 --> 00:23:59,193 or 419 00:24:00,920 --> 00:24:01,753 on 420 00:24:02,670 --> 00:24:05,320 in and with. 421 00:24:05,320 --> 00:24:08,410 And there might be some other exceptions here 422 00:24:08,410 --> 00:24:10,610 but this is just an example. 423 00:24:10,610 --> 00:24:13,850 Or you can always search for title case on Google 424 00:24:13,850 --> 00:24:17,290 and see the exact rules if you want to make sure 425 00:24:17,290 --> 00:24:18,900 that this really works. 426 00:24:18,900 --> 00:24:20,170 now, right? 427 00:24:20,170 --> 00:24:24,340 And by the way, it is a bit of a common pattern 428 00:24:24,340 --> 00:24:28,080 to create an array of exceptions and then use that 429 00:24:28,080 --> 00:24:30,993 for some computation further down the road. 430 00:24:32,190 --> 00:24:34,570 I've done this myself many times. 431 00:24:34,570 --> 00:24:36,770 That's all keep this technique in mind 432 00:24:38,680 --> 00:24:42,223 but now let's go on to the actual conversion. 433 00:24:43,240 --> 00:24:45,083 So let's call it title case. 434 00:24:47,270 --> 00:24:52,270 And so of course, we must work on this title argument 435 00:24:52,800 --> 00:24:54,350 that comes in. 436 00:24:54,350 --> 00:24:57,500 And so what should be start by doing. 437 00:24:57,500 --> 00:24:59,650 Well, first of all, let's do something 438 00:24:59,650 --> 00:25:03,200 that we should many times do with our input strings, 439 00:25:03,200 --> 00:25:04,720 as I mentioned before 440 00:25:04,720 --> 00:25:08,360 which is to convert them all to lowercase. 441 00:25:08,360 --> 00:25:10,780 And this is especially important in this case 442 00:25:10,780 --> 00:25:14,850 because we are now working with capitalization. 443 00:25:14,850 --> 00:25:17,860 So we will capitalize some of the words. 444 00:25:17,860 --> 00:25:22,560 And so they should of course all be lowercase to start with. 445 00:25:22,560 --> 00:25:27,070 So that's then going to affect like this or this board here. 446 00:25:27,070 --> 00:25:31,560 Then we need to capitalize each word here individually 447 00:25:31,560 --> 00:25:32,520 of course. 448 00:25:32,520 --> 00:25:35,460 And so we need to be able to work individually 449 00:25:35,460 --> 00:25:37,230 on each of the words. 450 00:25:37,230 --> 00:25:40,943 And so whenever that is the case, we need an array. 451 00:25:42,980 --> 00:25:46,280 So we need to split this string into an array 452 00:25:46,280 --> 00:25:49,943 so that these words, which are separated by spaces, 453 00:25:50,870 --> 00:25:54,110 each of them are going to be one of the elements 454 00:25:54,110 --> 00:25:55,053 of the array. 455 00:25:56,220 --> 00:26:00,280 So split and then by the empty string 456 00:26:01,380 --> 00:26:04,123 and then by the space character. 457 00:26:05,794 --> 00:26:08,750 And this is of course far from being done, 458 00:26:08,750 --> 00:26:12,560 but that's none of the less already returned us 459 00:26:12,560 --> 00:26:14,503 just to see if it works. 460 00:26:19,530 --> 00:26:21,543 So this is exactly what we just did. 461 00:26:22,420 --> 00:26:26,160 And so now let's work on these words. 462 00:26:26,160 --> 00:26:29,180 So basically we want to now go through the array 463 00:26:29,180 --> 00:26:31,260 and capitalized each of the words 464 00:26:31,260 --> 00:26:33,883 that is not in the acceptance array. 465 00:26:35,250 --> 00:26:38,740 So here, for example, the a is in the exceptions array. 466 00:26:38,740 --> 00:26:41,370 So we don't want to capitalize this word 467 00:26:41,370 --> 00:26:43,773 but we want to do it for all the ones. 468 00:26:44,650 --> 00:26:46,960 So basically we want a new array 469 00:26:46,960 --> 00:26:49,280 which all of these same words here. 470 00:26:49,280 --> 00:26:54,000 So the same five elements, but some of them capitalized. 471 00:26:54,000 --> 00:26:56,590 And so again, whenever we want a new array 472 00:26:56,590 --> 00:27:00,740 of the same size as before, we use map. 473 00:27:00,740 --> 00:27:05,453 And so now finally, or old friend map comes into play again. 474 00:27:06,500 --> 00:27:09,820 So in this array, each element is a word 475 00:27:09,820 --> 00:27:11,193 so let's call it that. 476 00:27:12,340 --> 00:27:14,923 And so again, we want to capitalize it. 477 00:27:15,912 --> 00:27:19,320 So let's just do it for starters, for all of them. 478 00:27:19,320 --> 00:27:22,440 And remember that one of the techniques to doing that 479 00:27:22,440 --> 00:27:25,440 is to take the first character of the string 480 00:27:26,570 --> 00:27:30,260 so like this and put it to uppercase 481 00:27:32,560 --> 00:27:33,830 like this. 482 00:27:33,830 --> 00:27:37,003 And then we simply add the rest of the string to it. 483 00:27:38,070 --> 00:27:38,903 Remember? 484 00:27:38,903 --> 00:27:40,193 So we did that previously. 485 00:27:41,530 --> 00:27:46,530 And so the rest of the string is basically taking everything 486 00:27:46,870 --> 00:27:49,100 starting at position number one. 487 00:27:49,100 --> 00:27:50,460 So let's check that 488 00:27:51,560 --> 00:27:55,700 and indeed it worked beautifully. 489 00:27:55,700 --> 00:27:59,620 Now, the only problem is that we have these exceptions here. 490 00:27:59,620 --> 00:28:03,140 So we have an a here and a but, 491 00:28:03,140 --> 00:28:06,540 and here is a width. 492 00:28:06,540 --> 00:28:09,670 And so you want to now use the exceptions array 493 00:28:09,670 --> 00:28:10,833 to exclude them. 494 00:28:12,090 --> 00:28:13,453 So how should we do that? 495 00:28:15,020 --> 00:28:18,540 So excluding kind of sounds like filtering maybe 496 00:28:18,540 --> 00:28:20,210 but that's not what we want here 497 00:28:21,070 --> 00:28:24,470 because we still want to keep an array of the same length. 498 00:28:24,470 --> 00:28:29,200 We just don't want to apply this year to all the words. 499 00:28:29,200 --> 00:28:32,560 And so what we're gonna do here is another logic. 500 00:28:32,560 --> 00:28:33,480 So we will do 501 00:28:35,040 --> 00:28:38,550 exceptions and then we are going to check 502 00:28:38,550 --> 00:28:41,850 if the current word is included in that array. 503 00:28:41,850 --> 00:28:45,360 And so for that, we have another array methods 504 00:28:46,490 --> 00:28:49,030 which we studied many times before 505 00:28:49,030 --> 00:28:50,713 which is called includes. 506 00:28:51,690 --> 00:28:53,980 So here we are checking for that word. 507 00:28:53,980 --> 00:28:58,030 And then as you notice, we'll return a boolean. 508 00:28:58,030 --> 00:28:59,800 So true, false. 509 00:28:59,800 --> 00:29:03,120 And then we can use that boolean to basically ask 510 00:29:03,120 --> 00:29:06,010 if the word is an exception or not. 511 00:29:06,010 --> 00:29:10,520 So if the word is indeed included in the exceptions, 512 00:29:10,520 --> 00:29:13,193 then we want to simply return that word. 513 00:29:14,410 --> 00:29:16,850 And only otherwise we want 514 00:29:16,850 --> 00:29:18,963 to then return the capitalized version. 515 00:29:20,380 --> 00:29:24,830 So let's check and indeed that already worked. 516 00:29:24,830 --> 00:29:29,830 So a and but, and down here do you with 517 00:29:29,830 --> 00:29:31,973 are now no longer capitalized. 518 00:29:33,370 --> 00:29:36,300 Let's actually change or fixed that here 519 00:29:40,090 --> 00:29:41,370 exceptions 520 00:29:43,860 --> 00:29:44,713 like this. 521 00:29:45,580 --> 00:29:47,360 So that looks better. 522 00:29:47,360 --> 00:29:50,820 So again, let's go over that logic here. 523 00:29:50,820 --> 00:29:55,580 So if the current word, so for example, this a here 524 00:29:55,580 --> 00:29:59,080 is included in this exceptions array 525 00:29:59,080 --> 00:30:01,920 then simply return that word. 526 00:30:01,920 --> 00:30:04,100 So without any modifications, 527 00:30:04,100 --> 00:30:07,490 but if not, well then capitalize it 528 00:30:07,490 --> 00:30:10,830 according to this rule or just technique here 529 00:30:10,830 --> 00:30:13,980 that I demonstrated earlier. 530 00:30:13,980 --> 00:30:17,450 And so after that, it is actually really easy. 531 00:30:17,450 --> 00:30:21,780 Now, all we have to do is to join the array back 532 00:30:21,780 --> 00:30:25,023 with the space and there we go. 533 00:30:26,210 --> 00:30:27,373 That's actually it. 534 00:30:28,710 --> 00:30:33,710 I noticed that I just forgot one word here, which is and. 535 00:30:33,720 --> 00:30:35,930 So that's also an exception. 536 00:30:35,930 --> 00:30:37,520 Let's give it a save. 537 00:30:37,520 --> 00:30:40,440 And so this creates this weird situation 538 00:30:40,440 --> 00:30:42,750 where the first word of the title 539 00:30:42,750 --> 00:30:44,880 is actually not capitalized. 540 00:30:44,880 --> 00:30:46,830 And of course we don't want that 541 00:30:47,750 --> 00:30:49,750 but that's actually an easy fix. 542 00:30:49,750 --> 00:30:51,700 All we have to do is in the end 543 00:30:52,750 --> 00:30:56,343 then capitalized that entire title case. 544 00:30:59,910 --> 00:31:04,380 So basically doing this here on the final output 545 00:31:04,380 --> 00:31:05,600 that we have here. 546 00:31:05,600 --> 00:31:07,320 But let's not copied this. 547 00:31:07,320 --> 00:31:12,320 Let's instead re-factor this into a standalone function. 548 00:31:13,180 --> 00:31:15,760 Let's put it in here actually 549 00:31:15,760 --> 00:31:19,260 because we don't need this function anywhere else. 550 00:31:19,260 --> 00:31:21,223 So capitalize, 551 00:31:22,610 --> 00:31:23,943 it takes a string. 552 00:31:25,410 --> 00:31:27,200 And then here, instead of words, 553 00:31:27,200 --> 00:31:31,350 we will use string to make it a general function. 554 00:31:31,350 --> 00:31:34,003 And then here we will call it with word. 555 00:31:39,910 --> 00:31:41,750 So everything works the same. 556 00:31:41,750 --> 00:31:44,330 And then as I mentioned earlier 557 00:31:44,330 --> 00:31:46,320 when we returned the title case, 558 00:31:46,320 --> 00:31:49,303 we simply capitalize it again. 559 00:31:50,290 --> 00:31:52,020 So just to make sure that a situation 560 00:31:52,020 --> 00:31:53,853 like this here does not happen. 561 00:31:55,430 --> 00:31:56,640 So title case 562 00:31:57,490 --> 00:31:59,180 and here we go, 563 00:31:59,180 --> 00:32:00,910 problem solved. 564 00:32:00,910 --> 00:32:01,743 Nice. 565 00:32:02,710 --> 00:32:07,340 So I hope that these were four nice examples 566 00:32:07,340 --> 00:32:11,530 for you to practice these array methods even more 567 00:32:11,530 --> 00:32:13,620 so that you are not ready finally 568 00:32:13,620 --> 00:32:17,130 for the final coding challenge of this section. 569 00:32:17,130 --> 00:32:18,923 So let's go there right now.