1 00:00:00,330 --> 00:00:01,430 Welcome back. 2 00:00:01,440 --> 00:00:07,050 Let's get started with the first type of loop that we are going to call for loop. 3 00:00:07,350 --> 00:00:13,920 We have a lot of them, so let's take them one by one or one after the other. 4 00:00:14,250 --> 00:00:24,510 So as usual, I have created a new folder and I have name it as loops as we see here. 5 00:00:24,510 --> 00:00:33,230 And I have one file that is my HTML and my JavaScript file with empty code this time to write JavaScript. 6 00:00:33,240 --> 00:00:35,430 So let's class it. 7 00:00:35,430 --> 00:00:41,070 And remember I have required the JavaScript here as that. 8 00:00:41,070 --> 00:00:44,760 So let me collapse up this and let's open the JavaScript. 9 00:00:44,850 --> 00:00:47,430 Now it's time to do some loops. 10 00:00:48,360 --> 00:00:49,080 So. 11 00:00:49,880 --> 00:00:53,820 First of all, you need to have the syntax. 12 00:00:53,840 --> 00:00:56,950 So we have couple types of loops. 13 00:00:56,960 --> 00:01:02,570 One is called for loop and let's start with a for loop first. 14 00:01:03,140 --> 00:01:06,500 So for loop has the following syntax. 15 00:01:06,830 --> 00:01:15,290 The first statements create a loop that consists of three optional expressions and then enclose in parentheses 16 00:01:15,290 --> 00:01:17,480 and separated by semicolons. 17 00:01:17,480 --> 00:01:19,310 So let me show you what I mean here. 18 00:01:19,520 --> 00:01:24,680 So to be able to repeat certain tasks, many times I want to write a loop. 19 00:01:24,800 --> 00:01:30,440 But before we start to write syntax for loop, let's have this scenario. 20 00:01:30,920 --> 00:01:37,730 The problem here is that our logic here is that we won't display numbers from 1 to 5 to the console. 21 00:01:38,030 --> 00:01:47,810 So it's easy, let's say right or let's say display 1 to 5. 22 00:01:49,050 --> 00:01:51,900 To the console. 23 00:01:52,860 --> 00:01:53,220 Okay. 24 00:01:53,250 --> 00:01:54,690 So as easy as this. 25 00:01:54,930 --> 00:01:58,620 And then one, I can copy this one and paste it. 26 00:01:59,410 --> 00:02:00,100 Five times. 27 00:02:00,100 --> 00:02:01,660 Changes 1 to 2. 28 00:02:02,110 --> 00:02:03,730 Changes 1 to 3. 29 00:02:04,450 --> 00:02:05,620 This 1 to 4. 30 00:02:05,620 --> 00:02:07,990 And lastly, five. 31 00:02:08,020 --> 00:02:09,539 Changes 1 to 5. 32 00:02:09,550 --> 00:02:12,940 Now, if I save it, check the console. 33 00:02:13,090 --> 00:02:16,540 Yeah, I have five one, two, five from 1 to 5. 34 00:02:16,540 --> 00:02:19,210 So why do I need a loop where I don't need loop? 35 00:02:19,240 --> 00:02:19,570 Okay. 36 00:02:19,570 --> 00:02:21,620 Now change this one to. 37 00:02:22,880 --> 00:02:27,060 And this question is, let's display this one, one, two. 38 00:02:27,880 --> 00:02:28,930 900. 39 00:02:29,190 --> 00:02:32,140 Hey, can you copy this one 900 times? 40 00:02:32,410 --> 00:02:33,130 Oh, no. 41 00:02:33,130 --> 00:02:34,450 That's why we need a loop. 42 00:02:34,570 --> 00:02:40,720 So let me copy this one and place it down here and then come in this one out and see why we need a loop. 43 00:02:41,020 --> 00:02:43,690 So, first of all, let's talk about. 44 00:02:44,820 --> 00:02:45,500 For loop. 45 00:02:45,510 --> 00:02:47,940 Bring it down here and this one up here. 46 00:02:48,600 --> 00:02:49,620 Okay, for loop. 47 00:02:49,620 --> 00:02:51,300 So let's look at it, syntax. 48 00:02:51,330 --> 00:02:55,110 Let's make it 1 to 100 so that our console.log will not be matched. 49 00:02:55,650 --> 00:02:59,250 So here comes our 0 to 100. 50 00:02:59,250 --> 00:03:00,720 I think this one is okay, right? 51 00:03:00,720 --> 00:03:01,140 Yeah. 52 00:03:01,860 --> 00:03:02,760 So here comes. 53 00:03:02,760 --> 00:03:05,100 How can we write loop syntax? 54 00:03:05,190 --> 00:03:06,780 We bring in four. 55 00:03:08,870 --> 00:03:09,560 You get it? 56 00:03:09,560 --> 00:03:12,170 And then my parentheses. 57 00:03:14,620 --> 00:03:15,490 Like that. 58 00:03:15,910 --> 00:03:18,190 Then what goes into are into it. 59 00:03:18,220 --> 00:03:20,770 We have what is called initialization. 60 00:03:20,770 --> 00:03:26,620 So let me write here as initialization. 61 00:03:27,820 --> 00:03:31,570 These are placeholders and I break my semicolon. 62 00:03:32,200 --> 00:03:34,870 Next one is my condition. 63 00:03:37,490 --> 00:03:39,860 Then also I bring semicolon. 64 00:03:40,100 --> 00:03:49,790 And then my final expression You're going to be my final expression or my increment or decrement. 65 00:03:50,120 --> 00:03:56,570 So this one can be decrement or increment depending on how you want for let's make it as increment. 66 00:03:58,000 --> 00:03:58,600 Okay. 67 00:03:58,990 --> 00:04:01,120 And now my carry braces. 68 00:04:02,160 --> 00:04:02,900 Perfect. 69 00:04:02,910 --> 00:04:04,980 So now the code. 70 00:04:06,890 --> 00:04:08,780 To run here. 71 00:04:08,990 --> 00:04:14,060 So when we say initialization, meaning where do you want to start? 72 00:04:14,180 --> 00:04:16,339 That is initialization. 73 00:04:16,640 --> 00:04:23,460 So looking at our logic here, you want to print from 0 to 100. 74 00:04:23,480 --> 00:04:31,130 So zero is our starting point so we can assign key here as syntax. 75 00:04:31,130 --> 00:04:32,780 Syntax. 76 00:04:33,860 --> 00:04:36,980 So now coming here, let's write a red code here. 77 00:04:37,010 --> 00:04:39,020 Now you follow the syntax here. 78 00:04:39,140 --> 00:04:43,080 So first of all, is my first step is my limit. 79 00:04:43,130 --> 00:04:44,330 Here are steps. 80 00:04:45,920 --> 00:04:47,150 Steps. 81 00:04:49,100 --> 00:04:49,740 Okay. 82 00:04:50,180 --> 00:04:50,960 Like that. 83 00:04:51,290 --> 00:04:53,060 So this is my question. 84 00:04:53,180 --> 00:04:57,980 So let me bring the question here so that I will see clearly what we are trying to do. 85 00:04:58,370 --> 00:05:02,240 So this is my question and it's my syntax and it's my step. 86 00:05:02,300 --> 00:05:04,190 Step number one is. 87 00:05:06,090 --> 00:05:08,550 One is initialize. 88 00:05:09,780 --> 00:05:10,800 Any. 89 00:05:11,710 --> 00:05:16,900 Initial initials in the spellings initialize. 90 00:05:16,900 --> 00:05:20,590 So here we can default it to any variable. 91 00:05:20,590 --> 00:05:26,830 But ideally we make it as a which represents initialization and is equal to zero. 92 00:05:26,950 --> 00:05:28,270 That's where we want. 93 00:05:28,450 --> 00:05:36,460 So now our right mind four for loop four and then my parenthesis like that. 94 00:05:37,150 --> 00:05:37,660 Okay. 95 00:05:38,050 --> 00:05:48,700 So inside the my parentheses here next is I'll bring in my initialization, which is I. 96 00:05:49,750 --> 00:05:50,870 That's the first one. 97 00:05:50,890 --> 00:05:51,570 Okay. 98 00:05:51,580 --> 00:05:57,550 So we can even just declare as empty, as undefined here. 99 00:05:57,580 --> 00:06:05,000 And now inside my my I mean, my initialization, I would say I equal to zero, which the same thing. 100 00:06:05,020 --> 00:06:08,020 Remember how we assign a variable? 101 00:06:08,710 --> 00:06:08,860 Okay. 102 00:06:08,980 --> 00:06:09,670 It is same thing. 103 00:06:09,670 --> 00:06:17,950 So I have done with my my starting point for initialization as what I equal to zero. 104 00:06:18,400 --> 00:06:20,260 Next one is my condition. 105 00:06:20,590 --> 00:06:30,640 Condition is that if I is less than my 100, that's what I want to end. 106 00:06:31,480 --> 00:06:36,730 If this condition is true, then let me break my braces. 107 00:06:37,180 --> 00:06:43,140 If that condition is true, then the code here is going to run by how are you going to increase this? 108 00:06:43,150 --> 00:06:53,740 So I'll bring in my semicolon and now I want my final expression called increment because upon each 109 00:06:53,740 --> 00:06:56,880 loop, loop goes goes like this one. 110 00:06:56,890 --> 00:07:05,200 If the conditions meet, it goes like this first loop, my first loop, and then again second loop, 111 00:07:05,770 --> 00:07:07,930 third loop, fourth loop, fifth to this one. 112 00:07:07,930 --> 00:07:12,790 I'm going to run hundred times if only the condition is true. 113 00:07:12,940 --> 00:07:21,520 So upon each loop I want to increase my I so that when you get to 100, the code here will never run. 114 00:07:21,520 --> 00:07:23,140 So I want to increase. 115 00:07:23,940 --> 00:07:24,240 Plus. 116 00:07:24,240 --> 00:07:27,570 Plus, I remember increment and decrement. 117 00:07:27,600 --> 00:07:29,070 Now we are going to use it here. 118 00:07:29,100 --> 00:07:30,210 I told you before. 119 00:07:30,690 --> 00:07:34,980 So here we can console the log. 120 00:07:35,850 --> 00:07:37,180 I and see. 121 00:07:37,500 --> 00:07:38,560 Moment of truth. 122 00:07:38,580 --> 00:07:41,340 Before I save it, let's check the console here. 123 00:07:41,610 --> 00:07:42,630 Let's save it. 124 00:07:42,870 --> 00:07:45,450 And now we see something has happened. 125 00:07:45,450 --> 00:07:47,280 Here we have a spot. 126 00:07:47,310 --> 00:07:50,730 As soon as I save it, I have these numbers being printed. 127 00:07:50,730 --> 00:07:51,600 One. 128 00:07:53,310 --> 00:07:53,730 Why? 129 00:07:53,760 --> 00:07:55,440 0 to 99. 130 00:07:56,070 --> 00:07:59,070 If I change this one to, let's say 900. 131 00:07:59,070 --> 00:07:59,970 If I save it. 132 00:08:01,110 --> 00:08:02,410 Is he at his ports? 133 00:08:02,630 --> 00:08:03,060 I have. 134 00:08:03,420 --> 00:08:04,410 I have it. 135 00:08:04,440 --> 00:08:11,610 If you want to have 900 inclusive, make it less than or equal to. 136 00:08:12,980 --> 00:08:15,820 Equal to remember our personal practice. 137 00:08:15,830 --> 00:08:20,450 Now I have 900 also, so that is about Lupe. 138 00:08:20,870 --> 00:08:25,010 So this is what you call the for Lupe if. 139 00:08:25,040 --> 00:08:26,270 Let me go over again. 140 00:08:26,270 --> 00:08:27,100 I think. 141 00:08:27,320 --> 00:08:28,550 Let me make it five. 142 00:08:28,910 --> 00:08:29,100 Okay. 143 00:08:29,150 --> 00:08:30,590 For the meantime, make it five. 144 00:08:30,620 --> 00:08:32,150 We're going to have 1 to 5. 145 00:08:32,210 --> 00:08:32,720 Okay. 146 00:08:32,720 --> 00:08:35,470 So let me reiterate again, you go. 147 00:08:35,480 --> 00:08:38,030 This one sometimes look tricky if you are new to programming. 148 00:08:38,240 --> 00:08:42,289 So let me have some illustration here. 149 00:08:42,650 --> 00:08:49,130 So first one, we have our initialization, which is zero because we have declared a variable. 150 00:08:49,130 --> 00:08:50,660 We can do it in line. 151 00:08:51,480 --> 00:08:54,630 You can say, let I equal to zero. 152 00:08:54,660 --> 00:08:56,590 Okay, let's add equal to zero. 153 00:08:56,610 --> 00:08:59,300 But because you don't want to clumsy this play, that's why you have it. 154 00:08:59,300 --> 00:09:03,210 I hear they reference it here as my initialization. 155 00:09:03,240 --> 00:09:06,030 I think this is not all that confusing. 156 00:09:06,510 --> 00:09:08,220 Next one is this. 157 00:09:08,880 --> 00:09:14,340 My condition is I less than five? 158 00:09:15,230 --> 00:09:20,660 Because at the beginning I is zero, so I is less than five. 159 00:09:20,660 --> 00:09:22,280 So this code would run. 160 00:09:22,580 --> 00:09:27,310 So at a first loop here at the first loop here is zero. 161 00:09:27,320 --> 00:09:28,030 Right. 162 00:09:28,040 --> 00:09:29,030 You got it here. 163 00:09:29,030 --> 00:09:29,540 You've got this. 164 00:09:29,540 --> 00:09:32,630 I go the first loop goes like this. 165 00:09:33,260 --> 00:09:40,520 So at first loop here is zero and here is zero because we have console.log in the I here. 166 00:09:40,520 --> 00:09:50,810 So I is over here and then on second loop, second loop I has become one because we have increased the 167 00:09:50,810 --> 00:09:52,820 zero by one. 168 00:09:52,820 --> 00:09:56,090 So now I has become one here. 169 00:09:56,090 --> 00:09:57,320 So we have it here. 170 00:09:57,470 --> 00:09:59,480 That is our second loop. 171 00:10:01,400 --> 00:10:02,860 Or over and over. 172 00:10:02,860 --> 00:10:09,430 And then until we as soon as we increase, I'm going to have this condition to be force. 173 00:10:10,000 --> 00:10:11,350 That is it about for loop. 174 00:10:11,410 --> 00:10:12,820 So if I still know. 175 00:10:12,820 --> 00:10:13,990 Okay, don't worry. 176 00:10:13,990 --> 00:10:17,860 We can ask questions in the comment section or our discord group. 177 00:10:17,860 --> 00:10:19,240 Are we there to assist you?