WEBVTT 1 00:00:01.321 --> 00:00:02.370 In this lecture, 2 00:00:02.370 --> 00:00:05.500 we're gonna talk about solving problems. 3 00:00:05.500 --> 00:00:08.630 Solving problems is one of the most important things 4 00:00:08.630 --> 00:00:10.320 in programming. 5 00:00:10.320 --> 00:00:13.760 So if your goal is to become a great programmer, 6 00:00:13.760 --> 00:00:17.363 you need to learn how to deal with problems effectively. 7 00:00:18.260 --> 00:00:21.050 So in this video, I will show you how to think 8 00:00:21.050 --> 00:00:23.690 as a developer by solving problems, 9 00:00:23.690 --> 00:00:26.583 using a simple four step framework. 10 00:00:27.900 --> 00:00:31.430 And let's use our friend John again. 11 00:00:31.430 --> 00:00:34.970 So, after some time John can code now, 12 00:00:34.970 --> 00:00:37.700 he is almost job ready at this point, 13 00:00:37.700 --> 00:00:41.940 but he still needs to work on his problem solving skills. 14 00:00:41.940 --> 00:00:45.310 And in programming, when we say solving problems 15 00:00:45.310 --> 00:00:49.240 we mean a real problem that needs a real solution. 16 00:00:49.240 --> 00:00:53.060 For example, in an array or GPS coordinates, 17 00:00:53.060 --> 00:00:55.670 find the two closest to points. 18 00:00:55.670 --> 00:00:59.180 And this problem is not straight forward, right? 19 00:00:59.180 --> 00:01:02.760 There are a lot of steps involved in solving this. 20 00:01:02.760 --> 00:01:06.170 And so we need a way to effectively solve problems 21 00:01:06.170 --> 00:01:10.440 like this one, or even way more complex ones. 22 00:01:10.440 --> 00:01:14.650 So problem solving does not mean to fix coding mistakes 23 00:01:14.650 --> 00:01:16.660 or bucks, all right? 24 00:01:16.660 --> 00:01:19.720 Anyway, whenever John encounters a problem 25 00:01:19.720 --> 00:01:21.320 that he needs to solve, 26 00:01:21.320 --> 00:01:25.720 he usually just jumps at the problem without much thinking. 27 00:01:25.720 --> 00:01:29.860 He also implements his solutions in an unstructured way 28 00:01:29.860 --> 00:01:32.460 without much of a logical approach. 29 00:01:32.460 --> 00:01:34.360 This makes him stressed out 30 00:01:34.360 --> 00:01:37.660 when things don't work right away. 31 00:01:37.660 --> 00:01:39.510 Another problem that John has, 32 00:01:39.510 --> 00:01:42.180 is that he is too proud to research 33 00:01:42.180 --> 00:01:46.390 when he doesn't know how to come up with his own solution. 34 00:01:46.390 --> 00:01:49.830 So, all of this is not effective at all, 35 00:01:49.830 --> 00:01:52.900 and makes John waste a lot of time. 36 00:01:52.900 --> 00:01:56.380 Now, the first fix to this is to always stay calm 37 00:01:56.380 --> 00:02:00.130 and slow down and not just jump at a solution 38 00:02:00.130 --> 00:02:01.723 without having a plan. 39 00:02:02.600 --> 00:02:04.830 Also, when solving problems, 40 00:02:04.830 --> 00:02:06.500 you need to be in a mindset 41 00:02:06.500 --> 00:02:09.950 of taking a logical and rational approach, 42 00:02:09.950 --> 00:02:14.500 after all programming is just logic, all right? 43 00:02:14.500 --> 00:02:17.130 Then when you are in the right mindset, 44 00:02:17.130 --> 00:02:19.430 just use my four step framework 45 00:02:19.430 --> 00:02:21.163 to solve the problem at hand. 46 00:02:22.140 --> 00:02:24.180 And the first step of the framework 47 00:02:24.180 --> 00:02:28.240 is to make sure that you 100% understand the problem. 48 00:02:28.240 --> 00:02:32.500 Step back and take a high-level look at the big picture. 49 00:02:32.500 --> 00:02:34.850 And the most important part of the step 50 00:02:34.850 --> 00:02:37.080 is to ask the right questions 51 00:02:37.080 --> 00:02:40.870 in order to get a clear picture of the whole problem. 52 00:02:40.870 --> 00:02:43.140 And the best way of understanding this, 53 00:02:43.140 --> 00:02:46.193 is probably to look at an example together here. 54 00:02:47.200 --> 00:02:49.940 So let's say you are working at some company 55 00:02:49.940 --> 00:02:51.330 on some project, 56 00:02:51.330 --> 00:02:54.167 and then your project manager comes and tells you, 57 00:02:54.167 --> 00:02:56.607 "We need a function that reverses, 58 00:02:56.607 --> 00:02:59.510 "whatever we pass into it." 59 00:02:59.510 --> 00:03:01.990 And that's all you know about the problem, 60 00:03:01.990 --> 00:03:04.530 but do you understand it 100%? 61 00:03:04.530 --> 00:03:07.260 Well, probably not, right? 62 00:03:07.260 --> 00:03:09.240 I know that I don't. 63 00:03:09.240 --> 00:03:13.470 So let's ask the right questions to get there. 64 00:03:13.470 --> 00:03:15.010 First we can ask, 65 00:03:15.010 --> 00:03:18.540 what does whatever actually mean in this context? 66 00:03:18.540 --> 00:03:21.810 So, what should actually be reversed here? 67 00:03:21.810 --> 00:03:24.220 Well, and if we think about it, 68 00:03:24.220 --> 00:03:26.860 it only makes sense to reverse strings, 69 00:03:26.860 --> 00:03:29.130 numbers, and arrays. 70 00:03:29.130 --> 00:03:31.930 Objects don't have a well-defined order, 71 00:03:31.930 --> 00:03:33.960 so we can't reverse them. 72 00:03:33.960 --> 00:03:37.040 We're also not gonna reverse like undefined, 73 00:03:37.040 --> 00:03:39.543 or null or a Boolean, right? 74 00:03:40.620 --> 00:03:43.200 Then after we have that figured out, 75 00:03:43.200 --> 00:03:46.740 we can ask, what should we do if something else 76 00:03:46.740 --> 00:03:51.160 is passed in that is no string, number, or array? 77 00:03:51.160 --> 00:03:53.270 How are we gonna handle that? 78 00:03:53.270 --> 00:03:55.120 It's also relevant to ask, 79 00:03:55.120 --> 00:03:58.360 what exactly should be returned from the function? 80 00:03:58.360 --> 00:04:01.260 For example, should it always be a string, 81 00:04:01.260 --> 00:04:05.160 or should the tie be the same as was passed in? 82 00:04:05.160 --> 00:04:07.900 Well, in this case, probably we should always 83 00:04:07.900 --> 00:04:11.820 just returned the exact same type that was passed in. 84 00:04:11.820 --> 00:04:15.940 Also we can start to ask more solution oriented questions, 85 00:04:15.940 --> 00:04:19.880 like how to recognize whether the argument is a number, 86 00:04:19.880 --> 00:04:22.280 a string, or an array? 87 00:04:22.280 --> 00:04:24.750 Or how to actually it reverse a number, 88 00:04:24.750 --> 00:04:27.230 a string and an array. 89 00:04:27.230 --> 00:04:29.510 So these are just some of the questions 90 00:04:29.510 --> 00:04:31.320 that we can ask here. 91 00:04:31.320 --> 00:04:32.710 I'm sure there are more, 92 00:04:32.710 --> 00:04:34.460 but this should already give us 93 00:04:34.460 --> 00:04:37.993 a way more clear picture of this problem. 94 00:04:38.920 --> 00:04:41.600 Now, right now, at the beginning of your journey, 95 00:04:41.600 --> 00:04:43.610 you were probably not yet know, 96 00:04:43.610 --> 00:04:47.520 what the right questions actually are, but don't worry, 97 00:04:47.520 --> 00:04:50.643 this will come with time and practice I promise. 98 00:04:52.270 --> 00:04:55.360 The next step is probably the most important one, 99 00:04:55.360 --> 00:04:58.820 which is the divide and conquer strategy. 100 00:04:58.820 --> 00:05:02.130 Divide and conquer means to break up the big problem 101 00:05:02.130 --> 00:05:05.300 into as many small problems as possible 102 00:05:05.300 --> 00:05:09.940 because these small problems are then a lot easier to solve. 103 00:05:09.940 --> 00:05:13.180 And this also ties in with the previous step 104 00:05:13.180 --> 00:05:16.470 because by dividing the problem into sub problems, 105 00:05:16.470 --> 00:05:18.880 you also take the big problem apart, 106 00:05:18.880 --> 00:05:21.690 until you understand it exactly. 107 00:05:21.690 --> 00:05:23.730 So based on the previous step, 108 00:05:23.730 --> 00:05:26.130 if we wanted to break down this problem, 109 00:05:26.130 --> 00:05:29.500 we could define a couple of sub problems. 110 00:05:29.500 --> 00:05:31.590 First, we need to check if the argument 111 00:05:31.590 --> 00:05:34.840 is a number, a string, or an array. 112 00:05:34.840 --> 00:05:38.930 And this is in fact, a small sub problem, right? 113 00:05:38.930 --> 00:05:40.800 So now, and just solve this one 114 00:05:40.800 --> 00:05:43.650 in isolation and then move on. 115 00:05:43.650 --> 00:05:47.760 The next sub problem is to implement reversing a number, 116 00:05:47.760 --> 00:05:50.360 then implement reversing a string, 117 00:05:50.360 --> 00:05:53.060 and then implement reversing an array, 118 00:05:53.060 --> 00:05:54.610 so that we are ready to deal 119 00:05:54.610 --> 00:05:57.270 whatever is passed into the function. 120 00:05:57.270 --> 00:06:00.120 Finally, we then also need of course 121 00:06:00.120 --> 00:06:03.210 to return the reversed value. 122 00:06:03.210 --> 00:06:05.560 So these are our sub problems, 123 00:06:05.560 --> 00:06:08.770 and they kind of look like a task list 124 00:06:08.770 --> 00:06:11.860 that we now need to go ahead and implement. 125 00:06:11.860 --> 00:06:14.790 And this is great because it makes our work 126 00:06:14.790 --> 00:06:17.000 so much easier now. 127 00:06:17.000 --> 00:06:21.220 Now, sure, this example is a pretty simple problem, 128 00:06:21.220 --> 00:06:23.720 but this strategy works just as well 129 00:06:23.720 --> 00:06:27.340 for bigger and way more complex problems. 130 00:06:27.340 --> 00:06:30.940 In fact, divide and conquer isn't essential method 131 00:06:30.940 --> 00:06:33.790 of problem solving that is also used a lot 132 00:06:33.790 --> 00:06:35.223 outside of programming. 133 00:06:36.120 --> 00:06:39.410 Anyway, with this, we have actually already covered 134 00:06:39.410 --> 00:06:42.810 the two most important steps of the framework. 135 00:06:42.810 --> 00:06:46.060 But now let's say that we actually do not know 136 00:06:46.060 --> 00:06:49.080 how to implement one of these sub problems. 137 00:06:49.080 --> 00:06:52.490 Well, in that case, we should not be afraid 138 00:06:52.490 --> 00:06:55.730 of doing as much research as we have to. 139 00:06:55.730 --> 00:06:58.180 Now, of course, we should always first try 140 00:06:58.180 --> 00:07:01.140 to implement a sub problem on our own 141 00:07:01.140 --> 00:07:04.140 using our own coding abilities. 142 00:07:04.140 --> 00:07:06.140 But if we're constantly hitting a wall, 143 00:07:06.140 --> 00:07:09.700 and cannot move on, then we should waste no more time 144 00:07:09.700 --> 00:07:14.040 and just find out how it works using Google, 145 00:07:14.040 --> 00:07:16.240 or a questions and answers websites 146 00:07:16.240 --> 00:07:21.240 like Stack Overflow, or the MDN JavaScript documentation. 147 00:07:21.440 --> 00:07:24.520 We will see how to use these in the next lecture 148 00:07:24.520 --> 00:07:27.800 when we're gonna work together on a real problem. 149 00:07:27.800 --> 00:07:30.980 And actually researching is a huge part 150 00:07:30.980 --> 00:07:35.240 of a programmer's job, as you will find out very soon. 151 00:07:35.240 --> 00:07:37.630 So you really should not be ashamed 152 00:07:37.630 --> 00:07:40.750 when you don't know enough to solve a certain problem. 153 00:07:40.750 --> 00:07:43.090 Let's just completely normal. 154 00:07:43.090 --> 00:07:46.710 Now, in this case some questions that we could Google are, 155 00:07:46.710 --> 00:07:49.150 how to check if a value is a number, 156 00:07:49.150 --> 00:07:52.430 or an array, or a string in JavaScript. 157 00:07:52.430 --> 00:07:54.950 Or we could Google how to reverse a number, 158 00:07:54.950 --> 00:07:58.920 or a string, or an array in JavaScript, okay? 159 00:07:58.920 --> 00:08:01.650 And again, we will do this in the next lecture 160 00:08:01.650 --> 00:08:03.363 on a real problem together. 161 00:08:04.380 --> 00:08:08.210 Finally, in case we are trying to solve bigger problems 162 00:08:08.210 --> 00:08:10.850 we should put all the previous steps together 163 00:08:10.850 --> 00:08:13.860 and write some so-called pseudo-code 164 00:08:13.860 --> 00:08:16.410 before writing the actual code. 165 00:08:16.410 --> 00:08:20.050 And pseudo-code is simply an informal description 166 00:08:20.050 --> 00:08:23.020 of the actual code that we're gonna write. 167 00:08:23.020 --> 00:08:27.290 So it's like code for humans to understand not computers. 168 00:08:27.290 --> 00:08:29.390 For our example, the pseudo-code 169 00:08:29.390 --> 00:08:32.140 might look something like this. 170 00:08:32.140 --> 00:08:36.310 So you see we use some structures of a programming language, 171 00:08:36.310 --> 00:08:40.702 but this is clearly not JavaScript, right? 172 00:08:40.702 --> 00:08:42.540 And there are no real rules 173 00:08:42.540 --> 00:08:44.780 on how to write pseudo-code either, 174 00:08:44.780 --> 00:08:47.950 you just write so that you understand it yourself, 175 00:08:47.950 --> 00:08:50.260 or other people on your team. 176 00:08:50.260 --> 00:08:52.430 So in this example, we just start 177 00:08:52.430 --> 00:08:55.180 by naming the function as a reverse, 178 00:08:55.180 --> 00:08:58.280 and then we basically pass in a value. 179 00:08:58.280 --> 00:09:01.040 Then we say, that if the type of the value 180 00:09:01.040 --> 00:09:03.890 is not a string and not a number, 181 00:09:03.890 --> 00:09:08.460 and also not an array, then simply return the value back. 182 00:09:08.460 --> 00:09:11.230 And that's because as we defined previously, 183 00:09:11.230 --> 00:09:13.900 we only want dysfunction to work for strings 184 00:09:13.900 --> 00:09:17.010 or for numbers or for a race. 185 00:09:17.010 --> 00:09:18.830 And again, you can clearly see 186 00:09:18.830 --> 00:09:22.920 that this is not any valid JavaScript at all. 187 00:09:22.920 --> 00:09:27.860 But anyway, if the type of the value past this initial test, 188 00:09:27.860 --> 00:09:30.580 then we say if the value is a string, 189 00:09:30.580 --> 00:09:32.260 then reverse the string. 190 00:09:32.260 --> 00:09:35.390 If the value is a number, then reverse the number. 191 00:09:35.390 --> 00:09:38.530 And if the value is an array, 192 00:09:38.530 --> 00:09:40.477 then simply reversed the array. 193 00:09:40.477 --> 00:09:41.460 And then at the end, 194 00:09:41.460 --> 00:09:44.910 we want to return to reversed value, okay? 195 00:09:44.910 --> 00:09:48.010 So this is really more like a list of instructions 196 00:09:48.010 --> 00:09:51.420 that we now could go ahead and actually implement 197 00:09:51.420 --> 00:09:54.080 using the JavaScript language. 198 00:09:54.080 --> 00:09:55.800 Okay, and that's it. 199 00:09:55.800 --> 00:09:58.350 That's the four steps to solve any problem 200 00:09:58.350 --> 00:10:00.600 no matter how big. 201 00:10:00.600 --> 00:10:04.810 And now before I leave you, a final tip I can give you, 202 00:10:04.810 --> 00:10:08.580 is to develop a genuine curiosity and passion 203 00:10:08.580 --> 00:10:11.730 for understanding how things actually work, 204 00:10:11.730 --> 00:10:13.470 not only in programming, 205 00:10:13.470 --> 00:10:16.530 but really in the whole world around you. 206 00:10:16.530 --> 00:10:19.700 For example, the famous scientist Richard Feynman, 207 00:10:19.700 --> 00:10:23.080 was repairing radios when he was just a teenager, 208 00:10:23.080 --> 00:10:27.730 and Elon Musk made his first computer game when he was 12. 209 00:10:27.730 --> 00:10:30.290 And there are many more examples like this, 210 00:10:30.290 --> 00:10:33.490 and all of them became geniuses in their fields 211 00:10:33.490 --> 00:10:36.990 in part because of their genuine curiosity 212 00:10:36.990 --> 00:10:39.253 on how the world around them works. 213 00:10:40.170 --> 00:10:42.500 All right, and with that being said, 214 00:10:42.500 --> 00:10:44.820 let's now go ahead and solve a real problem 215 00:10:44.820 --> 00:10:47.490 in the next lecture using this framework 216 00:10:47.490 --> 00:10:49.160 that we just learned about. 217 00:10:49.160 --> 00:10:50.353 So I'll see you there.