1 00:00:01,440 --> 00:00:03,730 There are a few more things that we need 2 00:00:03,730 --> 00:00:05,700 to learn about classes. 3 00:00:05,700 --> 00:00:08,943 And so, let's actually create a new class now. 4 00:00:10,850 --> 00:00:12,320 And as an example, 5 00:00:12,320 --> 00:00:14,123 we are gonna use the bank account 6 00:00:14,123 --> 00:00:17,780 that we implemented before, in the Bankist app. 7 00:00:17,780 --> 00:00:19,460 Remember that? 8 00:00:19,460 --> 00:00:24,450 So, let's say class Account, and then as always, 9 00:00:26,770 --> 00:00:29,500 we need the constructor method. 10 00:00:29,500 --> 00:00:33,023 And here each account should have the owner name. 11 00:00:34,490 --> 00:00:37,840 It should have a defined currency, 12 00:00:37,840 --> 00:00:40,733 and also, we want to pass in a pin. 13 00:00:42,930 --> 00:00:46,740 And so, let's say this.owner is owner 14 00:00:47,640 --> 00:00:50,343 and the same for currency and the pin. 15 00:00:53,360 --> 00:00:58,360 So, we already know how to do all of this, right? 16 00:00:58,668 --> 00:01:01,423 And so now let's create a new account here. 17 00:01:02,440 --> 00:01:07,440 Let's say acc1, and so new account, 18 00:01:07,760 --> 00:01:09,430 and let's say that I am the owner. 19 00:01:09,430 --> 00:01:14,430 So, Jonas, then the currency is in Euro and the pin, 20 00:01:15,130 --> 00:01:16,563 let's say, is this one? 21 00:01:19,890 --> 00:01:21,290 All right. 22 00:01:21,290 --> 00:01:24,710 So, indeed we have the three values that we passed 23 00:01:24,710 --> 00:01:29,020 into the constructor, now inside of the object. 24 00:01:29,020 --> 00:01:31,570 But now what about the movements array, 25 00:01:31,570 --> 00:01:34,350 and maybe also the local. 26 00:01:34,350 --> 00:01:37,100 So, we want to start always with an empty array 27 00:01:37,100 --> 00:01:39,230 as the movements and the local, 28 00:01:39,230 --> 00:01:43,090 we want to get from the navigator.language. 29 00:01:43,090 --> 00:01:45,280 So, how should we do that? 30 00:01:45,280 --> 00:01:48,013 Should we add a new parameter, like this? 31 00:01:48,930 --> 00:01:53,740 So, movement, and then always pass in an empty array 32 00:01:53,740 --> 00:01:55,523 in all the accounts that we create. 33 00:01:56,500 --> 00:01:59,110 Well, that would work. 34 00:01:59,110 --> 00:02:01,420 So, let's actually see that. 35 00:02:01,420 --> 00:02:06,070 So, movement, actually movements should be equal 36 00:02:06,070 --> 00:02:08,830 to movements, here as well. 37 00:02:08,830 --> 00:02:10,950 And so now, as you see, 38 00:02:10,950 --> 00:02:13,790 the movement is now this empty array, 39 00:02:13,790 --> 00:02:15,750 however, it doesn't make much sense 40 00:02:15,750 --> 00:02:18,110 to pass in this empty array, 41 00:02:18,110 --> 00:02:22,260 into all the new accounts that we want to create, right? 42 00:02:22,260 --> 00:02:26,883 So, we don't need this, and instead we can simply do this. 43 00:02:28,300 --> 00:02:31,520 And so, this is something that we didn't do before, 44 00:02:31,520 --> 00:02:34,320 but of course we can create even more properties 45 00:02:34,320 --> 00:02:36,950 on any instance and properties 46 00:02:36,950 --> 00:02:39,790 that are not based on any inputs. 47 00:02:39,790 --> 00:02:43,430 And the same we can now do for the local 48 00:02:43,430 --> 00:02:48,430 and set it to navigator.language, right? 49 00:02:50,430 --> 00:02:53,193 And so now, all of that appears here as well. 50 00:02:55,370 --> 00:02:58,390 And in fact, we can even execute any code 51 00:02:58,390 --> 00:03:00,603 here in this constructor that we want. 52 00:03:02,510 --> 00:03:07,510 So, let's say, "Thanks for opening an account," 53 00:03:13,256 --> 00:03:15,140 and then owner. 54 00:03:15,140 --> 00:03:18,370 And so, when Jonas opens a new account, 55 00:03:18,370 --> 00:03:21,880 then he's basically greeted with this message here, 56 00:03:21,880 --> 00:03:24,620 coming right from the constructor. 57 00:03:24,620 --> 00:03:29,620 All right, but now what about the deposits and withdrawals? 58 00:03:30,060 --> 00:03:33,230 So, basically what about our movements? 59 00:03:33,230 --> 00:03:38,090 Well, we could simply now go ahead and do this. 60 00:03:38,090 --> 00:03:41,060 So we can take acc1.movements, 61 00:03:41,060 --> 00:03:43,710 and then if we wanted to do a deposit, 62 00:03:43,710 --> 00:03:46,200 we could push a value into this. 63 00:03:46,200 --> 00:03:51,200 Let's say 250, and then when we want to withdraw something, 64 00:03:52,110 --> 00:03:54,443 we would simply push a negative value. 65 00:03:55,330 --> 00:03:59,760 And so, if we then take a look at our account here, 66 00:03:59,760 --> 00:04:03,550 then of course we would see these movements right here 67 00:04:03,550 --> 00:04:04,930 in our array. 68 00:04:04,930 --> 00:04:09,070 However, it's not a good idea at all to do this. 69 00:04:09,070 --> 00:04:13,350 So, instead of interacting with a property like this, 70 00:04:13,350 --> 00:04:15,860 it's a lot better to create methods 71 00:04:15,860 --> 00:04:18,540 that interact with these properties. 72 00:04:18,540 --> 00:04:22,260 And that is especially true for important properties, 73 00:04:22,260 --> 00:04:25,020 such as these movements here. 74 00:04:25,020 --> 00:04:27,440 So, this will for sure avoid bugs 75 00:04:27,440 --> 00:04:30,400 in the future, as your application grows. 76 00:04:30,400 --> 00:04:33,420 So, let's now actually create a deposit 77 00:04:33,420 --> 00:04:35,563 and a withdrawal method here. 78 00:04:37,440 --> 00:04:42,253 So, deposit and inherit the value that we want to deposit. 79 00:04:43,790 --> 00:04:47,503 And then this.movements.push, 80 00:04:48,519 --> 00:04:50,093 the value that we pass into. 81 00:04:53,130 --> 00:04:55,203 And now the same for withdrawal. 82 00:04:58,370 --> 00:04:59,963 So, also a value. 83 00:05:00,920 --> 00:05:05,920 And so here, we can now actually call this method 84 00:05:05,990 --> 00:05:09,910 because it's actually gonna work basically the same way. 85 00:05:09,910 --> 00:05:12,630 So this.deposit. 86 00:05:12,630 --> 00:05:14,080 And so, as you can see here, 87 00:05:14,080 --> 00:05:16,660 we can actually call other methods 88 00:05:16,660 --> 00:05:18,730 inside of a certain method. 89 00:05:18,730 --> 00:05:22,340 So, in withdraw, we are calling this.deposit, 90 00:05:22,340 --> 00:05:25,270 but of course we still need to use the this keyword 91 00:05:25,270 --> 00:05:27,793 to be able to access this other method. 92 00:05:29,370 --> 00:05:32,820 And then here, we pass in minus the value 93 00:05:32,820 --> 00:05:34,733 that we received in this function. 94 00:05:36,220 --> 00:05:38,430 So let's try this now. 95 00:05:38,430 --> 00:05:39,973 So instead of doing this, 96 00:05:41,160 --> 00:05:43,970 we now can do it in a much nicer way. 97 00:05:43,970 --> 00:05:48,970 So acc1.deposit 250, and then acc1.withdraw 140. 98 00:05:57,160 --> 00:05:58,400 And so indeed, 99 00:05:58,400 --> 00:06:02,670 our movements array looks just the same as before, 100 00:06:02,670 --> 00:06:06,440 but now we are actually using this public interface 101 00:06:06,440 --> 00:06:09,570 that we built here, right? 102 00:06:09,570 --> 00:06:11,760 So, basically these methods here, 103 00:06:11,760 --> 00:06:14,560 are the interface to our objects, 104 00:06:14,560 --> 00:06:17,970 and we also call this API, remember? 105 00:06:17,970 --> 00:06:19,330 So, we talked about this, 106 00:06:19,330 --> 00:06:21,483 right at the beginning of the section. 107 00:06:22,740 --> 00:06:25,320 So again, let's actually write this here. 108 00:06:25,320 --> 00:06:29,750 So this is the public interface of our objects. 109 00:06:29,750 --> 00:06:32,660 And so, yeah, this is a lot better 110 00:06:32,660 --> 00:06:34,860 than having to manually manipulate 111 00:06:34,860 --> 00:06:39,860 these properties outside of the object, as we did here. 112 00:06:39,970 --> 00:06:44,750 Also this withdraw method here actually abstracts the fact 113 00:06:44,750 --> 00:06:48,880 that a withdrawal is basically a negative movement. 114 00:06:48,880 --> 00:06:50,980 So here as we did it manually, 115 00:06:50,980 --> 00:06:54,320 we needed to pass in minus 140. 116 00:06:54,320 --> 00:06:57,320 But now, as we do a withdrawal, it's of course, 117 00:06:57,320 --> 00:06:59,250 a lot more natural to write 118 00:06:59,250 --> 00:07:03,670 that simply 140 are gonna be withdrawn. 119 00:07:03,670 --> 00:07:06,890 So, what I'm trying to say is that this minus here, 120 00:07:06,890 --> 00:07:09,340 is something that the user of this object, 121 00:07:09,340 --> 00:07:11,070 shouldn't be caring about. 122 00:07:11,070 --> 00:07:14,220 And so now, we actually abstracted that away, 123 00:07:14,220 --> 00:07:16,590 right into this object, 124 00:07:16,590 --> 00:07:19,693 and in particular into this withdrawal method. 125 00:07:20,870 --> 00:07:24,080 So, just a very small obstruction here in this case, 126 00:07:24,080 --> 00:07:26,223 but it's still worth to notice. 127 00:07:27,150 --> 00:07:31,010 All right, now, of course, 128 00:07:31,010 --> 00:07:34,590 still there is nothing stopping someone on our team 129 00:07:34,590 --> 00:07:37,900 from interacting with the movements array directly 130 00:07:37,900 --> 00:07:42,250 and potentially making mistakes and introducing bugs. 131 00:07:42,250 --> 00:07:45,160 So, simply the fact that we have these methods, 132 00:07:45,160 --> 00:07:49,000 doesn't make it impossible to still do this. 133 00:07:49,000 --> 00:07:51,653 And the same goes, for example, for the pin. 134 00:07:52,900 --> 00:07:55,570 So, of course, we can access the pin 135 00:07:55,570 --> 00:07:57,713 from outside of the account. 136 00:07:59,400 --> 00:08:03,630 So, you see, but probably it shouldn't be accessible 137 00:08:03,630 --> 00:08:07,780 from outside of the class, but yeah, 138 00:08:07,780 --> 00:08:10,670 of course, right now it is accessible. 139 00:08:10,670 --> 00:08:14,990 And this is actually a very real and very important concern. 140 00:08:14,990 --> 00:08:17,260 So, it's not just something theoretical 141 00:08:17,260 --> 00:08:19,240 that I'm telling you here. 142 00:08:19,240 --> 00:08:21,853 And the same, of course, goes for methods. 143 00:08:23,940 --> 00:08:28,223 So, let's say we have a requestLoan method here, 144 00:08:31,450 --> 00:08:33,100 for some value. 145 00:08:33,100 --> 00:08:35,980 And remember that this was also a functionality 146 00:08:35,980 --> 00:08:39,150 of the Bankist application. 147 00:08:39,150 --> 00:08:42,070 So, we could make the approval of the loan based 148 00:08:42,070 --> 00:08:46,610 on some condition, and that condition could come 149 00:08:46,610 --> 00:08:50,095 from some other method, let's say, 150 00:08:50,095 --> 00:08:54,095 approveLoan, let's pass in a value here as well, 151 00:08:57,570 --> 00:09:01,590 and this one will simply always return true. 152 00:09:01,590 --> 00:09:05,440 So, I don't want to implement any complex logic here now, 153 00:09:05,440 --> 00:09:08,710 but anyway, here we can now call this.approveLoan 154 00:09:11,010 --> 00:09:12,113 with the value. 155 00:09:13,010 --> 00:09:14,890 And so if the loan is approved, 156 00:09:14,890 --> 00:09:19,890 then this.deposit of the value, 157 00:09:21,210 --> 00:09:24,420 and we can lock something to the console. 158 00:09:24,420 --> 00:09:29,420 So, "Loan approved" or something like that, okay? 159 00:09:29,800 --> 00:09:32,340 Now, in the public interface, 160 00:09:32,340 --> 00:09:34,793 we basically only want this method here. 161 00:09:35,670 --> 00:09:39,928 So, we want to be able to do this here basically, 162 00:09:39,928 --> 00:09:44,928 acc1.requestLoan, let's say of 1000. 163 00:09:46,960 --> 00:09:49,490 And so, we see that the loan was approved 164 00:09:49,490 --> 00:09:52,220 and it was pushed into our array. 165 00:09:52,220 --> 00:09:56,420 But, of course, we are also able to do this. 166 00:09:56,420 --> 00:09:57,753 So approveLoan. 167 00:10:00,250 --> 00:10:03,100 And so this, of course, doesn't do anything, 168 00:10:03,100 --> 00:10:04,210 but in the real world, 169 00:10:04,210 --> 00:10:07,773 we should not even be allowed to access this kind of method. 170 00:10:08,770 --> 00:10:10,910 So this is kind of an internal method 171 00:10:10,910 --> 00:10:14,910 that only the requestLoan method should be able to use. 172 00:10:14,910 --> 00:10:17,610 And so the reason why I'm telling you all this, 173 00:10:17,610 --> 00:10:19,750 is basically just to justify 174 00:10:19,750 --> 00:10:24,440 that we really need data encapsulation and data privacy. 175 00:10:24,440 --> 00:10:27,880 And we talked about these topics in the introductory lecture 176 00:10:27,880 --> 00:10:30,440 of the section, and so as always, 177 00:10:30,440 --> 00:10:32,880 you can go ahead and review that, 178 00:10:32,880 --> 00:10:34,960 but anyway, in the next video, 179 00:10:34,960 --> 00:10:38,150 we will finally start implementing data privacy 180 00:10:38,150 --> 00:10:40,180 and data encapsulation. 181 00:10:40,180 --> 00:10:42,163 So let's move on there right now.