1 00:00:02,160 --> 00:00:04,090 Now, let's build up on what we learned 2 00:00:04,090 --> 00:00:05,380 up to this point. 3 00:00:05,380 --> 00:00:08,540 We are calculating our adult years here 4 00:00:08,540 --> 00:00:12,400 by deducting 18 from the age. 5 00:00:12,400 --> 00:00:16,850 Now we can actually switch the order here 6 00:00:16,850 --> 00:00:19,750 and do that before I reassign the age. 7 00:00:19,750 --> 00:00:23,240 And then thereafter calculate the new adult years, 8 00:00:23,240 --> 00:00:25,743 which is age minus 18, again. 9 00:00:27,000 --> 00:00:29,350 So now I'm doing the same thing twice, 10 00:00:29,350 --> 00:00:31,770 but I do it for the different age values 11 00:00:31,770 --> 00:00:35,313 because, in between, I do assign a new age value. 12 00:00:36,200 --> 00:00:39,370 Now I'm still only outputting adult years once 13 00:00:39,370 --> 00:00:40,483 down there, though. 14 00:00:41,390 --> 00:00:43,520 Hence, if I do that and save this, 15 00:00:43,520 --> 00:00:44,440 if this reloads, 16 00:00:44,440 --> 00:00:49,040 I still only see 27 because I never alert adult years 17 00:00:49,040 --> 00:00:51,750 before I recalculated. 18 00:00:51,750 --> 00:00:53,370 But of course we could do that. 19 00:00:53,370 --> 00:00:56,840 We could also alert it here 20 00:00:56,840 --> 00:01:01,483 and then reassign the age and recalculate adult years. 21 00:01:02,370 --> 00:01:03,800 By the way, if you're wondering 22 00:01:03,800 --> 00:01:06,780 why I'm sometimes adding an empty line, 23 00:01:06,780 --> 00:01:09,160 this is totally optional, not required. 24 00:01:09,160 --> 00:01:12,550 I'm just doing it for readability purposes 25 00:01:12,550 --> 00:01:15,050 to make my code a bit easier to read. 26 00:01:15,050 --> 00:01:17,743 You don't have to add to those blank lines. 27 00:01:18,740 --> 00:01:20,210 But back to our code. 28 00:01:20,210 --> 00:01:22,530 I did now also alert adult years here. 29 00:01:22,530 --> 00:01:26,133 And hence, of course, we now see 14 and then 27. 30 00:01:27,160 --> 00:01:29,500 Now, why am I showing this here? 31 00:01:29,500 --> 00:01:34,500 Because, now we again have some code duplication. 32 00:01:34,890 --> 00:01:39,890 We are repeating the same step in two different places. 33 00:01:40,050 --> 00:01:43,160 And, do you see which step I'm talking about? 34 00:01:43,160 --> 00:01:45,783 Which operation I'm talking about? 35 00:01:47,250 --> 00:01:50,310 I'm talking about the calculation here, 36 00:01:50,310 --> 00:01:53,810 where we are deriving adult years. 37 00:01:53,810 --> 00:01:57,420 Now, of course, we are also repeating this alert code here, 38 00:01:57,420 --> 00:02:00,740 for example, but there is an important difference. 39 00:02:00,740 --> 00:02:03,620 For alert, we are just executing one command, 40 00:02:03,620 --> 00:02:05,990 which is built into the browser. 41 00:02:05,990 --> 00:02:09,490 For this operation here, for this calculation, 42 00:02:09,490 --> 00:02:14,410 we basically built our own very simple algorithm. 43 00:02:14,410 --> 00:02:17,550 We have a clearly defined operation 44 00:02:17,550 --> 00:02:20,250 that executes certain steps. 45 00:02:20,250 --> 00:02:24,963 In this case, one key step where we deduct 18 from age. 46 00:02:25,840 --> 00:02:27,860 But if this operation would change, 47 00:02:27,860 --> 00:02:31,310 if I, for some reason, need to add these values, 48 00:02:31,310 --> 00:02:33,310 instead of subtract them, 49 00:02:33,310 --> 00:02:35,693 then we have to do this in two places. 50 00:02:37,160 --> 00:02:41,330 And we typically want to avoid scenarios like this 51 00:02:41,330 --> 00:02:42,640 as a developer. 52 00:02:42,640 --> 00:02:46,160 We want to be "lazy," as it's sometimes called. 53 00:02:46,160 --> 00:02:50,810 We don't want to do the same work in different places, 54 00:02:50,810 --> 00:02:52,810 because if we ever decide 55 00:02:52,810 --> 00:02:54,990 that the correct operation would be 56 00:02:54,990 --> 00:02:58,360 to use a plus here to add these two values, 57 00:02:58,360 --> 00:03:01,300 then we have search our entire code 58 00:03:01,300 --> 00:03:03,880 for every occurrences of this operation 59 00:03:03,880 --> 00:03:06,050 and make the changes there as well, 60 00:03:06,050 --> 00:03:09,603 which is annoying and error prone. 61 00:03:10,890 --> 00:03:11,950 We can, for example, 62 00:03:11,950 --> 00:03:14,210 easily overlook one of the places 63 00:03:14,210 --> 00:03:16,030 where adjustments would be needed 64 00:03:16,030 --> 00:03:17,713 if we have complex code. 65 00:03:18,800 --> 00:03:23,800 That's why we typically want to put our own operations 66 00:03:24,020 --> 00:03:27,340 into our own clearly defined commands, 67 00:03:27,340 --> 00:03:28,660 which have their own name 68 00:03:28,660 --> 00:03:30,500 and which we can then reuse 69 00:03:30,500 --> 00:03:33,960 by just then using that name, so to say, 70 00:03:33,960 --> 00:03:38,090 instead of repeating the entire operation code all the time. 71 00:03:38,090 --> 00:03:41,500 So basically like it's working for the built in alert. 72 00:03:41,500 --> 00:03:43,850 Here, we always repeat the same command, 73 00:03:43,850 --> 00:03:45,740 which has the same name. 74 00:03:45,740 --> 00:03:48,090 And adding errors here is way harder 75 00:03:48,090 --> 00:03:51,570 because we get all the completion for that name and so on. 76 00:03:51,570 --> 00:03:54,690 And hence, this is a great way of reusing logic. 77 00:03:54,690 --> 00:03:58,990 The logic for outputting this alert box with some content. 78 00:03:58,990 --> 00:04:02,920 Here, we now also want to write our own command 79 00:04:02,920 --> 00:04:05,693 and that's called a function.