WEBVTT 1 00:00:01.310 --> 00:00:03.560 Now it's time to practice everything 2 00:00:03.560 --> 00:00:06.990 that you just learned about ES6 classes, 3 00:00:06.990 --> 00:00:10.113 and so let's now do coding challenge number two, 4 00:00:11.470 --> 00:00:12.990 and the goal of this one 5 00:00:12.990 --> 00:00:16.560 is to basically recreate challenge number one, 6 00:00:16.560 --> 00:00:20.210 but this time using an ES6 class, 7 00:00:20.210 --> 00:00:21.610 then besides that, 8 00:00:21.610 --> 00:00:24.320 I also want you to add a getter, 9 00:00:24.320 --> 00:00:26.990 which should be called speedUS, 10 00:00:26.990 --> 00:00:29.700 and this one should return the current speed 11 00:00:29.700 --> 00:00:31.850 in miles per hour. 12 00:00:31.850 --> 00:00:34.100 So remember that the original speed 13 00:00:34.100 --> 00:00:36.500 is in kilometers per hour, 14 00:00:36.500 --> 00:00:39.700 and people in the US are usually not used to that, 15 00:00:39.700 --> 00:00:43.253 and so we can create a special getter called speedUS, 16 00:00:44.120 --> 00:00:47.060 and to do the conversion from kilometers per hour 17 00:00:47.060 --> 00:00:51.083 to miles per hour, all you need to do is to divide by 1.6, 18 00:00:52.590 --> 00:00:54.900 then you should also implement a setter 19 00:00:54.900 --> 00:00:57.600 with the same name of speedUS 20 00:00:57.600 --> 00:01:00.510 so that people can basically set the speed 21 00:01:00.510 --> 00:01:02.440 also in miles per hour, 22 00:01:02.440 --> 00:01:05.770 but of course, that value should then be stored in the class 23 00:01:05.770 --> 00:01:07.830 as kilometers per hour, 24 00:01:07.830 --> 00:01:09.950 and so before storing the value, 25 00:01:09.950 --> 00:01:12.183 you need to multiply it by 1.6, 26 00:01:13.620 --> 00:01:17.450 so to convert it back to kilometers per hour, 27 00:01:17.450 --> 00:01:20.590 and then take this test data, number one here, 28 00:01:20.590 --> 00:01:23.400 and create a new car and experiment 29 00:01:23.400 --> 00:01:27.260 with all of the methods and getters and setters. 30 00:01:27.260 --> 00:01:29.270 So have some fun with this one, 31 00:01:29.270 --> 00:01:31.923 and I'll see you back here once you are ready. 32 00:01:36.180 --> 00:01:37.440 Okay. 33 00:01:37.440 --> 00:01:41.160 So hopefully you did that without any problems 34 00:01:41.160 --> 00:01:43.940 and you don't even need my solution, 35 00:01:43.940 --> 00:01:45.673 but of course, as always, 36 00:01:46.760 --> 00:01:48.840 I will still show it to you, 37 00:01:48.840 --> 00:01:52.580 and what I'm gonna do is to simply copy the code 38 00:01:52.580 --> 00:01:54.440 that we wrote earlier, 39 00:01:54.440 --> 00:01:57.190 and I will then convert it to a class 40 00:01:57.190 --> 00:01:59.373 because that's actually not that hard. 41 00:02:00.230 --> 00:02:03.620 So here, we just need to call it a class 42 00:02:05.240 --> 00:02:08.603 and let me call it cl again for class, 43 00:02:10.211 --> 00:02:11.170 and okay. 44 00:02:11.170 --> 00:02:13.260 So then the curly braces, 45 00:02:13.260 --> 00:02:16.353 so one in the beginning, one in the end, 46 00:02:17.240 --> 00:02:20.633 then this function is actually called the constructor, 47 00:02:21.640 --> 00:02:24.000 and the rest is the same. 48 00:02:24.000 --> 00:02:26.510 Here we don't need these, don't need these, 49 00:02:26.510 --> 00:02:30.750 and here we don't need the prototype, 50 00:02:30.750 --> 00:02:33.900 so that's the whole point of using classes, 51 00:02:33.900 --> 00:02:36.543 and then we don't need this function, 52 00:02:37.420 --> 00:02:40.790 and besides that, that's actually it. 53 00:02:40.790 --> 00:02:42.900 So that's the constructor function 54 00:02:42.900 --> 00:02:46.780 plus the methods that we added to its prototype property 55 00:02:46.780 --> 00:02:49.380 simply converted to a class. 56 00:02:49.380 --> 00:02:52.380 And all right, so that was pretty easy. 57 00:02:52.380 --> 00:02:56.223 Now let's talk about the speedUS getter and setter. 58 00:02:59.890 --> 00:03:03.370 So first up the getter, which is easier. 59 00:03:03.370 --> 00:03:08.370 So speedUS and this one does not need any input 60 00:03:10.030 --> 00:03:14.800 and it will simply return this.speed 61 00:03:16.230 --> 00:03:17.743 and then divide it by 1.6, 62 00:03:18.930 --> 00:03:22.073 as I instructed up there in the text. 63 00:03:23.440 --> 00:03:27.440 Alright, and let's already test this now, 64 00:03:27.440 --> 00:03:29.860 and the test data here is Ford 65 00:03:29.860 --> 00:03:33.023 going at 120 kilometers per hour. 66 00:03:35.940 --> 00:03:38.500 So that's a new CarCl 67 00:03:39.970 --> 00:03:41.830 with the make of Ford 68 00:03:41.830 --> 00:03:43.783 and a speed of 120. 69 00:03:44.920 --> 00:03:47.693 So let's accelerate here a little bit, 70 00:03:51.940 --> 00:03:53.130 but before we do that, 71 00:03:53.130 --> 00:03:57.810 let's actually also read the speed in the US, 72 00:03:57.810 --> 00:04:02.810 because I actually know that 120 is 75 miles per hour, 73 00:04:03.370 --> 00:04:05.933 and so then I can know if this actually worked, 74 00:04:07.300 --> 00:04:10.340 and this one here is simply returns the value, 75 00:04:10.340 --> 00:04:12.553 and so we need to log it to the console. 76 00:04:14.070 --> 00:04:15.300 And all right, 77 00:04:15.300 --> 00:04:20.300 so indeed this 75 here coming from line 270 78 00:04:20.790 --> 00:04:24.060 is this speedUS property, 79 00:04:24.060 --> 00:04:27.730 So again, we basically transformed a method here 80 00:04:27.730 --> 00:04:29.020 into a property 81 00:04:30.250 --> 00:04:33.960 so that we read like this by using a getter, 82 00:04:33.960 --> 00:04:38.730 then we accelerate a little bit, so we increase to 130, 83 00:04:38.730 --> 00:04:42.993 and so that means that these methods, they keep working, 84 00:04:44.680 --> 00:04:49.570 and so our conversion to a class a works flawlessly. 85 00:04:49.570 --> 00:04:50.730 And now to finish, 86 00:04:50.730 --> 00:04:54.060 let's just implement the setter here as well. 87 00:04:54.060 --> 00:04:55.650 So set speedUS, 88 00:04:56.712 --> 00:04:58.660 and then remember we always need 89 00:04:58.660 --> 00:05:00.723 to take exactly one argument, 90 00:05:02.840 --> 00:05:05.590 so that's gonna be the speed, of course, 91 00:05:05.590 --> 00:05:08.640 and so here, we want to set the speed, 92 00:05:08.640 --> 00:05:11.690 but of course, in kilometers per hour, 93 00:05:11.690 --> 00:05:15.133 and so we take the speed and multiply it by 1.6, 94 00:05:17.060 --> 00:05:21.060 and so now if we do ford.speed 95 00:05:22.560 --> 00:05:24.613 equals 50 miles per hour, 96 00:05:25.860 --> 00:05:29.033 then let's take a look at the ford object, 97 00:05:30.570 --> 00:05:33.253 and here of course, it needs to be US. 98 00:05:35.110 --> 00:05:39.460 All right, and so here we set the speed to 50, 99 00:05:39.460 --> 00:05:42.030 and then what we get here is 80, 100 00:05:42.030 --> 00:05:46.143 and so 80 is indeed 50 times 1.6. 101 00:05:48.600 --> 00:05:51.733 And so I think that's actually it. 102 00:05:53.080 --> 00:05:53.913 And yeah. 103 00:05:55.170 --> 00:05:57.303 So challenge number two completed.