1
00:00:01,270 --> 00:00:03,780
<v Instructor>Let's now explore some more features</v>

2
00:00:03,780 --> 00:00:05,260
of the for loop

3
00:00:05,260 --> 00:00:08,723
and also create a somewhat more useful example.

4
00:00:10,260 --> 00:00:12,670
And one of the most used applications

5
00:00:12,670 --> 00:00:16,560
of for loops is to loop through a race.

6
00:00:16,560 --> 00:00:21,283
So let's get back the array that we were using before.

7
00:00:22,670 --> 00:00:24,773
So where is that?

8
00:00:26,160 --> 00:00:27,280
So, I mean the one

9
00:00:28,220 --> 00:00:30,260
where we talked about objects.

10
00:00:30,260 --> 00:00:31,610
Yeah, this one.

11
00:00:31,610 --> 00:00:35,100
So go to this lecture about introduction to objects

12
00:00:35,100 --> 00:00:37,890
and then grab this Jonas array.

13
00:00:37,890 --> 00:00:40,620
And maybe you didn't write it back then

14
00:00:40,620 --> 00:00:44,163
but then you can just write it, right now.

15
00:00:45,480 --> 00:00:47,900
Okay, and so now we can use a for loop

16
00:00:47,900 --> 00:00:50,530
to loop through this array.

17
00:00:50,530 --> 00:00:54,230
And let's say for now that we wanted to individually

18
00:00:54,230 --> 00:00:57,440
log every element of the array to the console.

19
00:00:57,440 --> 00:00:59,030
So very simple.

20
00:00:59,030 --> 00:01:03,223
All we want to do is to log these five elements here.

21
00:01:04,290 --> 00:01:07,743
So let's write a for loop.

22
00:01:08,870 --> 00:01:11,920
And as always, we start with the counter.

23
00:01:11,920 --> 00:01:12,979
So let...

24
00:01:12,979 --> 00:01:16,960
And now a traditional counter variable name has been I

25
00:01:16,960 --> 00:01:18,530
for a long time.

26
00:01:18,530 --> 00:01:20,770
And so let's use that here as well.

27
00:01:20,770 --> 00:01:25,770
So just I, and this time we need to start it at zero.

28
00:01:26,210 --> 00:01:28,890
And that's because the array is zero based

29
00:01:28,890 --> 00:01:31,930
when it comes to reading elements out of the array.

30
00:01:31,930 --> 00:01:36,110
Remember, and this will make sense once we actually write

31
00:01:36,110 --> 00:01:38,750
the code of this loop.

32
00:01:38,750 --> 00:01:41,840
Let's now actually skip the condition for now.

33
00:01:41,840 --> 00:01:44,290
So we're gonna deal with that a little bit later.

34
00:01:45,210 --> 00:01:47,550
And so now updating the counter

35
00:01:47,550 --> 00:01:50,990
is gonna work exactly the same as before.

36
00:01:50,990 --> 00:01:53,800
So since we want to log all of the elements

37
00:01:53,800 --> 00:01:57,230
we need to update the counter variable simply by one.

38
00:01:57,230 --> 00:01:58,803
And so again, we use ++, okay.

39
00:02:01,000 --> 00:02:04,423
And now let's write or loop here itself.

40
00:02:05,530 --> 00:02:06,993
So console.log,

41
00:02:07,890 --> 00:02:10,550
and remember all we want to log to the console

42
00:02:10,550 --> 00:02:12,780
is each element of the array.

43
00:02:12,780 --> 00:02:14,370
And so without a loop

44
00:02:14,370 --> 00:02:17,180
we would write that like this,

45
00:02:17,180 --> 00:02:19,780
so Jonas zero.

46
00:02:19,780 --> 00:02:20,613
Right?

47
00:02:20,613 --> 00:02:23,083
And then let's do that outside.

48
00:02:23,960 --> 00:02:25,310
So we would do this

49
00:02:25,310 --> 00:02:29,110
this, and then all the way to

50
00:02:30,400 --> 00:02:31,253
number four.

51
00:02:33,981 --> 00:02:34,814
All right.

52
00:02:34,814 --> 00:02:36,590
So let's comment is out

53
00:02:36,590 --> 00:02:39,350
but this is helpful to see what kind of code

54
00:02:39,350 --> 00:02:41,090
we want to achieve.

55
00:02:41,090 --> 00:02:44,710
So again, we want to start at Jonas zero

56
00:02:44,710 --> 00:02:46,240
which is the first element.

57
00:02:46,240 --> 00:02:50,320
Jonas one is this one, then two, three, and four.

58
00:02:50,320 --> 00:02:54,570
And so that's the reason why we started the counter at zero

59
00:02:54,570 --> 00:02:57,200
because that's the first element that we want to get.

60
00:02:57,200 --> 00:02:59,410
It's Jonas zero.

61
00:02:59,410 --> 00:03:01,800
And so here, instead of hard coding to zero,

62
00:03:01,800 --> 00:03:05,280
of course, we are going to use or counter variable.

63
00:03:05,280 --> 00:03:06,803
So, and that's I.

64
00:03:07,930 --> 00:03:11,130
And now the trickiest part here, is the condition.

65
00:03:11,130 --> 00:03:14,150
And so that's why we left it for the end,

66
00:03:14,150 --> 00:03:16,860
but now we need to actually tackle it.

67
00:03:16,860 --> 00:03:20,233
So for how long do we want to keep this loop running?

68
00:03:21,090 --> 00:03:24,070
Well, it should run when I is zero.

69
00:03:24,070 --> 00:03:24,903
Right?

70
00:03:24,903 --> 00:03:29,750
It should also run when it's one two, three, and four.

71
00:03:29,750 --> 00:03:32,100
Because four is the last element.

72
00:03:32,100 --> 00:03:35,150
But when it's five, it's no longer run.

73
00:03:35,150 --> 00:03:35,983
Right?

74
00:03:35,983 --> 00:03:40,770
And that's because Jonas at five does not exist.

75
00:03:40,770 --> 00:03:41,913
Let's just write that,

76
00:03:48,590 --> 00:03:50,283
does not exist.

77
00:03:52,120 --> 00:03:55,470
And so that means that the I counter variable

78
00:03:55,470 --> 00:03:57,653
should always stay below five.

79
00:03:58,670 --> 00:04:01,060
So let's write that here.

80
00:04:01,060 --> 00:04:03,480
So I should stay

81
00:04:03,480 --> 00:04:05,860
below five.

82
00:04:05,860 --> 00:04:06,910
And so with this,

83
00:04:06,910 --> 00:04:10,910
as soon as the counter variable is updated to five

84
00:04:10,910 --> 00:04:14,373
then the next iteration of the loop will not run anymore.

85
00:04:15,290 --> 00:04:16,563
So let's try this.

86
00:04:18,080 --> 00:04:20,580
And here it's of course not Jonas

87
00:04:20,580 --> 00:04:22,730
it's Jonas array.

88
00:04:22,730 --> 00:04:25,123
So let's actually change the name up here,

89
00:04:26,030 --> 00:04:27,313
in the array itself.

90
00:04:28,630 --> 00:04:29,970
Try that again.

91
00:04:29,970 --> 00:04:34,760
And yeah, we get a log of each of the elements

92
00:04:34,760 --> 00:04:35,870
in the array.

93
00:04:35,870 --> 00:04:38,010
So all of the five of them.

94
00:04:38,010 --> 00:04:39,120
Great.

95
00:04:39,120 --> 00:04:42,020
But there's actually still one problem with this,

96
00:04:42,020 --> 00:04:45,210
which is that we hard-coded the length of the array

97
00:04:45,210 --> 00:04:46,263
here with five.

98
00:04:47,220 --> 00:04:48,563
So let's now say

99
00:04:48,563 --> 00:04:50,163
that we add another element,

100
00:04:51,020 --> 00:04:53,000
let's say just true.

101
00:04:53,000 --> 00:04:54,850
And so if we try this now,

102
00:04:54,850 --> 00:04:57,943
do you think that's true will be logged here as well?

103
00:04:59,720 --> 00:05:01,340
Well, it will not.

104
00:05:01,340 --> 00:05:04,620
Because of course we are still telling JavaScript

105
00:05:04,620 --> 00:05:07,220
that I should stay below five.

106
00:05:07,220 --> 00:05:10,990
And so it will not print the array at position number five,

107
00:05:10,990 --> 00:05:12,600
which does now exist.

108
00:05:12,600 --> 00:05:17,600
So now we do have Jonas at position five, right?

109
00:05:17,650 --> 00:05:19,470
And so the solution to this,

110
00:05:19,470 --> 00:05:21,650
is to not hard code the value here

111
00:05:21,650 --> 00:05:23,500
but to compute this value.

112
00:05:23,500 --> 00:05:27,160
So basically to get it from JavaScript itself.

113
00:05:27,160 --> 00:05:29,790
And how can we get this number?

114
00:05:29,790 --> 00:05:34,670
Well, actually this five is simply the length of the array

115
00:05:34,670 --> 00:05:35,640
right?

116
00:05:35,640 --> 00:05:39,040
Not of this one anymore, but off the original one.

117
00:05:39,040 --> 00:05:41,600
So this array has a length of five.

118
00:05:41,600 --> 00:05:44,870
And so five is exactly the number that we put here.

119
00:05:44,870 --> 00:05:48,630
And so we can simply replace the hard-coded value

120
00:05:48,630 --> 00:05:51,650
with a dynamically calculated one.

121
00:05:51,650 --> 00:05:55,020
and that's Jonas.length.

122
00:05:55,020 --> 00:05:56,375
Remember?

123
00:05:56,375 --> 00:05:58,270
So,

124
00:05:58,270 --> 00:05:59,223
let's try that.

125
00:06:00,200 --> 00:06:02,350
And indeed it still works.

126
00:06:02,350 --> 00:06:05,260
And if I now go back to adding something else

127
00:06:05,260 --> 00:06:06,460
like true,

128
00:06:06,460 --> 00:06:07,730
then Jonas.length

129
00:06:07,730 --> 00:06:09,570
will now be six.

130
00:06:09,570 --> 00:06:11,658
And that of course happens automatically.

131
00:06:11,658 --> 00:06:14,521
And we don't have to manually change any code

132
00:06:14,521 --> 00:06:15,993
in that loop.

133
00:06:17,230 --> 00:06:21,420
So now we did true also appears here in our luck.

134
00:06:21,420 --> 00:06:22,253
Great.

135
00:06:23,140 --> 00:06:25,130
Let's now also log something else here.

136
00:06:25,130 --> 00:06:27,473
Let's say the type of the variable.

137
00:06:28,590 --> 00:06:32,710
So type of Jonas i.

138
00:06:32,710 --> 00:06:35,180
And I hope that this part here makes sense.

139
00:06:35,180 --> 00:06:37,920
So the fact that we're using the counter variable here

140
00:06:37,920 --> 00:06:40,683
to retrieve all the elements of the array.

141
00:06:42,390 --> 00:06:45,050
So now let's say, so string,

142
00:06:45,050 --> 00:06:48,340
string, number, string, object.

143
00:06:48,340 --> 00:06:51,810
So remember how I said that an array is in fact an object

144
00:06:51,810 --> 00:06:53,963
and here we have the proof of that.

145
00:06:54,920 --> 00:06:57,873
And then finally the last one is of course a boolean.

146
00:06:58,880 --> 00:06:59,750
Okay.

147
00:06:59,750 --> 00:07:03,040
So I hope that this logic here made sense.

148
00:07:03,040 --> 00:07:05,090
And so this is in a nutshell,

149
00:07:05,090 --> 00:07:08,350
how we loop race using the for loop.

150
00:07:08,350 --> 00:07:11,510
Now, what we did here, was only to read values

151
00:07:11,510 --> 00:07:12,920
from an array.

152
00:07:12,920 --> 00:07:15,490
But now let's also at the same time,

153
00:07:15,490 --> 00:07:18,260
create a new array which will contain

154
00:07:18,260 --> 00:07:21,160
this type of each of the elements.

155
00:07:21,160 --> 00:07:23,900
So basically this, all right?

156
00:07:23,900 --> 00:07:25,820
So again, what I want to do now

157
00:07:25,820 --> 00:07:29,990
is to create a new array which will contain all the types

158
00:07:29,990 --> 00:07:32,210
for all these elements.

159
00:07:32,210 --> 00:07:35,180
And if that sounds a little bit useless,

160
00:07:35,180 --> 00:07:38,860
then just keep in mind that these are all just

161
00:07:38,860 --> 00:07:40,920
educational exercises.

162
00:07:40,920 --> 00:07:44,320
So I designed them to show you how these different features

163
00:07:44,320 --> 00:07:46,270
of the language work.

164
00:07:46,270 --> 00:07:50,260
So in real world, we would probably not create an array

165
00:07:50,260 --> 00:07:52,380
with types of variables.

166
00:07:52,380 --> 00:07:54,500
But this is excellent to show you,

167
00:07:54,500 --> 00:07:57,820
how to create a new array based on the values

168
00:07:57,820 --> 00:07:59,660
of one original array.

169
00:07:59,660 --> 00:08:01,770
So to do that we start by creating

170
00:08:01,770 --> 00:08:05,530
a new empty array outside of the loop.

171
00:08:05,530 --> 00:08:08,113
And let's do that here, after this one.

172
00:08:09,380 --> 00:08:11,433
So I will call this one types.

173
00:08:12,760 --> 00:08:16,350
And now I think this is something we didn't do before,

174
00:08:16,350 --> 00:08:18,980
which is to simply create an empty array.

175
00:08:18,980 --> 00:08:22,180
And all we have to do is to basically create an array

176
00:08:22,180 --> 00:08:27,160
with the usual syntax, but without any element inside of it.

177
00:08:27,160 --> 00:08:30,800
And so now we have to go here to the same loop

178
00:08:30,800 --> 00:08:33,330
because this new array types will be based

179
00:08:33,330 --> 00:08:34,610
on the Jonas array.

180
00:08:34,610 --> 00:08:36,450
So it's gonna have the same length.

181
00:08:36,450 --> 00:08:38,690
And so we can use the exact same loop

182
00:08:38,690 --> 00:08:42,143
that we used to read data from the Jonas loop

183
00:08:42,143 --> 00:08:45,593
also to construct this new types array.

184
00:08:46,810 --> 00:08:49,350
So let's say types,

185
00:08:49,350 --> 00:08:52,600
at position I, should be equal to

186
00:08:53,620 --> 00:08:57,450
type of Jonas

187
00:08:57,450 --> 00:08:59,780
at position I.

188
00:08:59,780 --> 00:09:01,400
And remember that this works

189
00:09:01,400 --> 00:09:04,470
because we can essentially do this.

190
00:09:04,470 --> 00:09:07,510
So we could do it again without the loop

191
00:09:07,510 --> 00:09:10,270
and say types zero

192
00:09:10,270 --> 00:09:13,720
is equals string.

193
00:09:13,720 --> 00:09:15,800
So this would work, right?

194
00:09:15,800 --> 00:09:18,890
And so of course it also works with the

195
00:09:18,890 --> 00:09:21,260
index number here dynamically.

196
00:09:21,260 --> 00:09:23,410
And so that's exactly what we're doing here

197
00:09:23,410 --> 00:09:25,940
in the exact same way as we read data

198
00:09:25,940 --> 00:09:27,163
from the Jonas array,

199
00:09:29,650 --> 00:09:30,530
right?

200
00:09:30,530 --> 00:09:32,430
So in iteration zero,

201
00:09:32,430 --> 00:09:37,430
we will have type zero equals type of Jonas zero.

202
00:09:37,720 --> 00:09:39,320
Then in the next iteration,

203
00:09:39,320 --> 00:09:41,400
we will have types one

204
00:09:41,400 --> 00:09:44,030
equals type of Jonas one

205
00:09:44,030 --> 00:09:46,683
and then two, three, four, and five.

206
00:09:47,840 --> 00:09:48,673
All right.

207
00:09:49,640 --> 00:09:52,110
So just to see if that works

208
00:09:52,110 --> 00:09:54,610
let's then log to the console,

209
00:09:54,610 --> 00:09:56,350
this newly created

210
00:09:56,350 --> 00:10:00,223
or to be more accurate, this newly filled array.

211
00:10:01,720 --> 00:10:03,760
So let's see.

212
00:10:03,760 --> 00:10:06,070
And indeed now we get this array

213
00:10:06,070 --> 00:10:09,170
which has exactly the types that we can see here as well.

214
00:10:09,170 --> 00:10:11,220
So string, string, number,

215
00:10:11,220 --> 00:10:13,550
string, object, and boolean.

216
00:10:13,550 --> 00:10:16,160
So these six that we also have here

217
00:10:16,160 --> 00:10:19,450
which means that we achieved our goal here.

218
00:10:19,450 --> 00:10:21,090
Now, this is just one way

219
00:10:21,990 --> 00:10:24,033
of filling an array.

220
00:10:25,300 --> 00:10:27,380
And let me write that down here,

221
00:10:27,380 --> 00:10:30,847
filling the types array.

222
00:10:30,847 --> 00:10:33,290
And here we do basically reading

223
00:10:35,200 --> 00:10:37,800
from Jonas array.

224
00:10:37,800 --> 00:10:40,410
But this is just one way of doing it.

225
00:10:40,410 --> 00:10:42,040
So let's comment out this one

226
00:10:42,040 --> 00:10:44,140
and do it in another way.

227
00:10:44,140 --> 00:10:46,880
And do you remember how to add elements

228
00:10:46,880 --> 00:10:49,420
to an array in another way?

229
00:10:49,420 --> 00:10:52,483
Well, we could use the push method, right?

230
00:10:54,040 --> 00:10:57,810
So that would be types.push.

231
00:10:57,810 --> 00:10:59,350
And remember that push

232
00:10:59,350 --> 00:11:02,600
adds a new element to the end of the array.

233
00:11:02,600 --> 00:11:05,460
And so here, we now need to pass in the element

234
00:11:05,460 --> 00:11:08,550
that we do want to add on to the array.

235
00:11:08,550 --> 00:11:09,740
And so that's again

236
00:11:09,740 --> 00:11:11,200
type of Jonas

237
00:11:12,180 --> 00:11:14,080
at position I.

238
00:11:14,080 --> 00:11:16,150
So off the current counter.

239
00:11:16,150 --> 00:11:17,913
And so if we try this now again,

240
00:11:19,810 --> 00:11:21,600
we should get to the same.

241
00:11:21,600 --> 00:11:24,380
And it's important that we add the new element

242
00:11:24,380 --> 00:11:27,550
to the end of array and not to the beginning.

243
00:11:27,550 --> 00:11:31,790
So we really need to use pushier and not unshift.

244
00:11:31,790 --> 00:11:34,130
So I think that this way of doing it here

245
00:11:34,130 --> 00:11:36,570
is actually a little bit cleaner.

246
00:11:36,570 --> 00:11:39,010
But if you prefer this first way here

247
00:11:39,010 --> 00:11:42,720
then of course you can just use that one as well.

248
00:11:42,720 --> 00:11:44,030
But what matters here,

249
00:11:44,030 --> 00:11:46,600
is that we really understood the logic

250
00:11:46,600 --> 00:11:50,480
of how to construct all the different parts of this for loop

251
00:11:50,480 --> 00:11:52,270
in order to loop the array.

252
00:11:52,270 --> 00:11:54,710
So it starts the counter being zero

253
00:11:54,710 --> 00:11:57,167
because that's the first element of the array.

254
00:11:57,167 --> 00:12:00,150
And then this condition here

255
00:12:00,150 --> 00:12:04,400
which specifies that the current index always needs to stay

256
00:12:04,400 --> 00:12:07,860
below the length of the array that we're looping through.

257
00:12:07,860 --> 00:12:09,930
And then in the loop itself

258
00:12:09,930 --> 00:12:13,860
we always get the current element using the current counter.

259
00:12:13,860 --> 00:12:15,400
Which is gonna go from zero

260
00:12:15,400 --> 00:12:18,573
to the length of the array minus one basically.

261
00:12:19,700 --> 00:12:20,533
All right.

262
00:12:21,710 --> 00:12:23,770
And to make sure we really get this

263
00:12:23,770 --> 00:12:27,290
let's try another, maybe more practical example.

264
00:12:27,290 --> 00:12:30,113
So let's go back to having an array of birth years.

265
00:12:31,920 --> 00:12:33,713
So 1991,

266
00:12:34,810 --> 00:12:35,760
2007,

267
00:12:35,760 --> 00:12:38,790
let's say 1969

268
00:12:38,790 --> 00:12:40,623
and 2020.

269
00:12:42,140 --> 00:12:45,230
And now what we want to do is to calculate the ages

270
00:12:45,230 --> 00:12:47,930
for all these four birth years here.

271
00:12:47,930 --> 00:12:50,850
And we want to store them in a new array.

272
00:12:50,850 --> 00:12:53,700
And that's a very common type of operation,

273
00:12:53,700 --> 00:12:56,210
which we actually already did before

274
00:12:56,210 --> 00:12:58,870
but without using loops.

275
00:12:58,870 --> 00:13:00,160
So essentially that's what we did

276
00:13:00,160 --> 00:13:01,883
in the tip calculator challenge.

277
00:13:05,610 --> 00:13:06,453
So,

278
00:13:08,030 --> 00:13:09,450
yeah, here.

279
00:13:09,450 --> 00:13:12,310
So here we had an array of three bills

280
00:13:12,310 --> 00:13:15,960
and then we manually calculated the tip for each of them.

281
00:13:15,960 --> 00:13:18,960
So manually we specified index zero,

282
00:13:18,960 --> 00:13:21,730
one and two,

283
00:13:21,730 --> 00:13:25,810
and created a new array based on these values.

284
00:13:25,810 --> 00:13:29,550
But in the real world, we would have used a loop to do that.

285
00:13:29,550 --> 00:13:31,543
And so that's what we will do now.

286
00:13:32,520 --> 00:13:33,353
Okay.

287
00:13:33,353 --> 00:13:35,983
Just with another, a bit more simple example.

288
00:13:37,330 --> 00:13:40,200
Years is the array which contains the birth years,

289
00:13:40,200 --> 00:13:42,090
and now let's create another

290
00:13:42,090 --> 00:13:45,683
and again, empty array, which will then hold the ages.

291
00:13:46,970 --> 00:13:48,420
And so what we're gonna do now

292
00:13:48,420 --> 00:13:52,890
is to loop through years and then fill up these ages array.

293
00:13:52,890 --> 00:13:55,023
So four,

294
00:13:55,860 --> 00:13:56,960
and then once more,

295
00:13:56,960 --> 00:14:00,050
let's define the counter at zero

296
00:14:00,050 --> 00:14:03,210
for the same reasons that we did it before.

297
00:14:03,210 --> 00:14:07,250
And it's not a problem that discounter variable here

298
00:14:07,250 --> 00:14:09,490
has exactly the same name.

299
00:14:09,490 --> 00:14:11,890
Then the condition is also gonna be the same.

300
00:14:11,890 --> 00:14:13,590
And actually the whole loop

301
00:14:13,590 --> 00:14:15,420
always kind of looks the same,

302
00:14:15,420 --> 00:14:17,680
when we loop over an array.

303
00:14:17,680 --> 00:14:19,040
So now here the difference

304
00:14:19,040 --> 00:14:22,910
is that it's of course, years.length.

305
00:14:22,910 --> 00:14:24,480
And then at the end,

306
00:14:24,480 --> 00:14:28,770
we as always increased the counter by one.

307
00:14:28,770 --> 00:14:31,620
And now what we need to do is to calculate the age

308
00:14:31,620 --> 00:14:33,200
of the current year.

309
00:14:33,200 --> 00:14:34,890
So that's gonna be,

310
00:14:34,890 --> 00:14:36,400
2037.

311
00:14:36,400 --> 00:14:39,700
So as always that's the year that we're currently in,

312
00:14:39,700 --> 00:14:43,430
let's say, and then minus the current birth here.

313
00:14:43,430 --> 00:14:45,143
So how do we get that?

314
00:14:46,090 --> 00:14:50,420
We say years, at the current loop position.

315
00:14:50,420 --> 00:14:51,253
Okay?

316
00:14:51,253 --> 00:14:52,460
So that's nothing new.

317
00:14:52,460 --> 00:14:55,210
I hope now at this point, okay.

318
00:14:55,210 --> 00:14:57,600
So we have this calculation now

319
00:14:57,600 --> 00:15:01,860
and now we want to add it to this new empty array.

320
00:15:01,860 --> 00:15:03,510
So we say we want to push it,

321
00:15:03,510 --> 00:15:04,707
to that array.

322
00:15:04,707 --> 00:15:07,970
And so we use the push method to do that.

323
00:15:07,970 --> 00:15:12,430
So ages.push.

324
00:15:12,430 --> 00:15:13,840
And so this is the value

325
00:15:13,840 --> 00:15:16,990
that we want to push into this empty array.

326
00:15:16,990 --> 00:15:18,733
And that's actually it.

327
00:15:20,090 --> 00:15:21,890
So let's check it out in a console

328
00:15:25,850 --> 00:15:26,700
and

329
00:15:28,440 --> 00:15:30,030
here we go.

330
00:15:30,030 --> 00:15:31,660
So just to confirm,

331
00:15:31,660 --> 00:15:36,413
2037 minus 1991 is of course 46.

332
00:15:37,960 --> 00:15:40,560
And that's just do it with 27 as well,

333
00:15:40,560 --> 00:15:42,360
2007 I mean.

334
00:15:42,360 --> 00:15:44,480
And so that's 30, which is this one.

335
00:15:44,480 --> 00:15:48,240
And so this array result, is correct indeed.

336
00:15:48,240 --> 00:15:51,490
So what we essentially did is this.

337
00:15:51,490 --> 00:15:53,810
We cannot do an operations

338
00:15:53,810 --> 00:15:56,370
between simple values and an array.

339
00:15:56,370 --> 00:15:58,430
So that I showed you earlier, right?

340
00:15:58,430 --> 00:16:00,980
We can not do 2037

341
00:16:00,980 --> 00:16:03,337
minus the years array.

342
00:16:03,337 --> 00:16:06,100
That will just give us not a number.

343
00:16:06,100 --> 00:16:08,060
And so here in this loop,

344
00:16:08,060 --> 00:16:10,420
we basically did it individually.

345
00:16:10,420 --> 00:16:13,060
So we did to calculation one by one.

346
00:16:13,060 --> 00:16:14,910
In each iteration of the loop

347
00:16:14,910 --> 00:16:17,060
we calculated 2037

348
00:16:17,060 --> 00:16:19,350
minus this year and then added it

349
00:16:19,350 --> 00:16:21,920
to the first position in the ages array.

350
00:16:21,920 --> 00:16:24,880
Then we did 2037 minus this

351
00:16:24,880 --> 00:16:27,920
and put it at the end of the ages array again.

352
00:16:27,920 --> 00:16:31,540
And then the same for this one and for 2020.

353
00:16:31,540 --> 00:16:32,420
Great.

354
00:16:32,420 --> 00:16:34,910
So that is a very very useful

355
00:16:34,910 --> 00:16:39,000
and important application of the for loop.

356
00:16:39,000 --> 00:16:40,060
And now to finish,

357
00:16:40,060 --> 00:16:42,820
let's learn about two important statements

358
00:16:42,820 --> 00:16:44,130
for loops.

359
00:16:44,130 --> 00:16:47,480
And that's the continue and to break statement.

360
00:16:47,480 --> 00:16:49,540
Let me just write that here,

361
00:16:49,540 --> 00:16:52,860
continue and break.

362
00:16:52,860 --> 00:16:54,663
And let's start with continue.

363
00:16:55,590 --> 00:17:00,110
So continue is to exit the current iteration of the loop

364
00:17:00,110 --> 00:17:02,150
and continue to the next one.

365
00:17:02,150 --> 00:17:04,800
On the other hand, break is used

366
00:17:04,800 --> 00:17:08,090
to completely terminate the whole loop.

367
00:17:08,090 --> 00:17:11,040
So let's see two quick examples for that.

368
00:17:11,040 --> 00:17:13,560
And let's go back to actually this loop

369
00:17:13,560 --> 00:17:15,470
that we had here.

370
00:17:15,470 --> 00:17:17,623
Where we looped this Jonas array.

371
00:17:18,570 --> 00:17:20,480
So I will just copy this,

372
00:17:20,480 --> 00:17:24,150
because we already learned how to loop through the array.

373
00:17:24,150 --> 00:17:25,800
And now I'm just interested in showing you

374
00:17:25,800 --> 00:17:28,793
how continue and to break a work.

375
00:17:29,780 --> 00:17:31,540
So let me delete this

376
00:17:31,540 --> 00:17:33,660
and this as well.

377
00:17:33,660 --> 00:17:36,280
And now let's say that for some reason,

378
00:17:36,280 --> 00:17:39,080
we only wanted to print elements to the array

379
00:17:39,080 --> 00:17:40,640
that are strings.

380
00:17:40,640 --> 00:17:44,310
And the continue statement is perfect for this.

381
00:17:44,310 --> 00:17:45,430
Because again,

382
00:17:45,430 --> 00:17:49,470
with continue we can exit the current iteration of the loop.

383
00:17:49,470 --> 00:17:51,943
So what we can do here, is to say,

384
00:17:53,160 --> 00:17:57,010
if the type of the current element

385
00:17:58,100 --> 00:17:59,330
so of Jonas I,

386
00:18:03,180 --> 00:18:04,483
is not a string,

387
00:18:06,940 --> 00:18:09,543
then continue.

388
00:18:10,580 --> 00:18:13,610
And so that's how we write the continue statement.

389
00:18:13,610 --> 00:18:16,640
It's really just this continue keyword.

390
00:18:16,640 --> 00:18:18,778
So again, what we want to do here,

391
00:18:18,778 --> 00:18:22,140
is to only log strings to the console.

392
00:18:22,140 --> 00:18:23,820
Which means that everything else,

393
00:18:23,820 --> 00:18:25,840
should basically be skipped.

394
00:18:25,840 --> 00:18:27,800
And that's what we do here.

395
00:18:27,800 --> 00:18:31,540
So we say, if the type of the current element,

396
00:18:31,540 --> 00:18:33,270
so that's this one here.

397
00:18:33,270 --> 00:18:35,210
So if the type of the current element

398
00:18:35,210 --> 00:18:38,380
is not a string then continue.

399
00:18:38,380 --> 00:18:39,920
Which again means,

400
00:18:39,920 --> 00:18:43,060
that the current iteration of the loop is exited,

401
00:18:43,060 --> 00:18:45,453
and then the next one starts immediately.

402
00:18:46,540 --> 00:18:50,590
So let's just write some other note here

403
00:18:50,590 --> 00:18:52,280
to the console just so we know

404
00:18:52,280 --> 00:18:54,250
what we're doing here, like

405
00:18:56,920 --> 00:18:58,490
all the strings

406
00:18:58,490 --> 00:19:00,480
because otherwise the output here

407
00:19:00,480 --> 00:19:03,433
is gonna start to look a little bit confusing.

408
00:19:04,800 --> 00:19:06,593
But anyway, let's test this now.

409
00:19:07,460 --> 00:19:10,840
And indeed, we only get strings now.

410
00:19:10,840 --> 00:19:12,870
So these three are strings

411
00:19:12,870 --> 00:19:15,070
and all the other ones are not strings.

412
00:19:15,070 --> 00:19:18,570
So this number, this array and this boolean,

413
00:19:18,570 --> 00:19:21,480
so they will now not get printed.

414
00:19:21,480 --> 00:19:23,760
Because we basically skipped them.

415
00:19:23,760 --> 00:19:25,800
For example, that eight number,

416
00:19:25,800 --> 00:19:27,650
which is 46 here.

417
00:19:27,650 --> 00:19:31,890
So the third element, does have to type number here.

418
00:19:31,890 --> 00:19:32,723
Right?

419
00:19:32,723 --> 00:19:34,030
So it's not a string.

420
00:19:34,030 --> 00:19:36,550
And so this year will be true

421
00:19:36,550 --> 00:19:39,820
because of course number is different than string.

422
00:19:39,820 --> 00:19:41,120
And so this is true.

423
00:19:41,120 --> 00:19:43,600
And so this code here, will run.

424
00:19:43,600 --> 00:19:45,250
And what continue will do

425
00:19:45,250 --> 00:19:48,380
is that it will immediately exit the current iteration.

426
00:19:48,380 --> 00:19:49,810
And so this line of code here,

427
00:19:49,810 --> 00:19:52,950
will not be executed in the current iteration.

428
00:19:52,950 --> 00:19:54,593
It will not even be reached.

429
00:19:55,440 --> 00:19:56,470
Okay.

430
00:19:56,470 --> 00:20:00,400
And now finally, let me just show you how break works.

431
00:20:00,400 --> 00:20:02,840
And remember that what break does

432
00:20:02,840 --> 00:20:05,610
is to completely terminate the whole loop.

433
00:20:05,610 --> 00:20:07,800
So not just the current iteration.

434
00:20:07,800 --> 00:20:11,510
So what we want to do now, is to log no other elements

435
00:20:11,510 --> 00:20:14,020
after we found a number.

436
00:20:14,020 --> 00:20:16,800
So essentially after a number is found

437
00:20:16,800 --> 00:20:18,800
which will be this 46 here,

438
00:20:18,800 --> 00:20:20,813
nothing else should be printed.

439
00:20:22,270 --> 00:20:23,930
So let's do that.

440
00:20:23,930 --> 00:20:25,680
And i will again, copy all of this.

441
00:20:27,820 --> 00:20:30,580
And so let's say here

442
00:20:31,570 --> 00:20:32,403
break

443
00:20:33,900 --> 00:20:35,043
with number.

444
00:20:36,290 --> 00:20:40,920
So let's translate a logic that we just said into the code.

445
00:20:40,920 --> 00:20:42,920
So as soon as a number is found,

446
00:20:42,920 --> 00:20:44,680
we want to break the loop.

447
00:20:44,680 --> 00:20:46,570
So, our if condition here should be

448
00:20:47,510 --> 00:20:49,640
type of Jonas I,

449
00:20:49,640 --> 00:20:51,100
so the current element,

450
00:20:51,100 --> 00:20:52,793
if it's equal to a number,

451
00:20:55,520 --> 00:20:58,383
so now that's number then break.

452
00:20:59,770 --> 00:21:00,603
Now, okay.

453
00:21:00,603 --> 00:21:01,973
Let's see the result here.

454
00:21:03,070 --> 00:21:06,510
And indeed, that's exactly what we wanted.

455
00:21:06,510 --> 00:21:09,060
So after the first number is found

456
00:21:09,060 --> 00:21:11,470
which is this 46 here,

457
00:21:11,470 --> 00:21:13,610
nothing else is printed.

458
00:21:13,610 --> 00:21:17,210
So in this iteration where the number is found

459
00:21:17,210 --> 00:21:19,950
not even this line of code is printed anymore

460
00:21:19,950 --> 00:21:22,163
and then the loop is terminated completely.

461
00:21:23,640 --> 00:21:24,560
All right.

462
00:21:24,560 --> 00:21:27,550
Now this might not sound very practical,

463
00:21:27,550 --> 00:21:30,330
but believe me there are some important use cases

464
00:21:30,330 --> 00:21:32,530
for continue and break.

465
00:21:32,530 --> 00:21:36,150
It's just hard to create some small and isolated

466
00:21:36,150 --> 00:21:40,470
code examples to show you just how useful they can be.

467
00:21:40,470 --> 00:21:42,480
But anyway I wanted to let you know

468
00:21:42,480 --> 00:21:45,200
that continue and break exist.

469
00:21:45,200 --> 00:21:47,870
But the most important takeaway from this lecture,

470
00:21:47,870 --> 00:21:49,700
is definitely to understand,

471
00:21:49,700 --> 00:21:51,570
how we can loop through a race

472
00:21:51,570 --> 00:21:53,793
using this kind of logic here.

473
00:21:54,820 --> 00:21:57,270
Okay, so this one here is really important

474
00:21:57,270 --> 00:21:59,653
that you understand this snippet of code.

