Welcome back, ladies and gentlemen.
Today, we do another awesome lecture, so create a lecture nine that Jesus link it here and I have
written some code here, but you don't have to worry about it.
So today we are going to do JavaScript loops and they are essential for JavaScript.
So I do have here car.
Sorry, so you can write this one down.
So I have cars name in here.
I do have some explanation because this will save me a time.
So let me just first explain you and then you can pause the video and do all of this.
OK, now the loops are very handy.
So if we want to run the same code over and over again and not to write it manually, then the loops
are very good for this.
Now we have different loops for while the well, for which there are others as well.
But it's OK for now to know all only this.
OK, so I do have this carceral and if I do want to do if I do want to bring out their values, their
items, then I will need to know their indexes.
Right.
So if I save this, they go back here, inspect, console, lock, and I will do have array of 11.
Right.
Good.
So also I can uncommon this one and I will see the names of all of the items manually.
But this is too much pain for us.
And we as developers don't want this.
That's why we went loops, because loops are working perfectly with arrays in the loops.
They're always start from position zero and what our starting position zero.
Well, look at this, the index of the arrays.
So that is going to be pretty much what you need to understand.
Now, the for loop, it's one of the mostly use loops and foreach now at the moment, actually.
But the thing is that they're saying so four have three different statements inside.
This will be when we set the variable eye to zero.
This is where we are checking the condition.
And this is we increment the value of I for one only.
So I plus plus is same as I equals I plus one.
So zero equals zero plus one.
It will be one.
OK, so the first statement will be executed only once before this block of code runs right in actually
in this block of code I have this comment.
They will not run but I have only control that lot.
Now this condition and this will be done in every loop.
So the condition must be true in order to get inside this curly bracket.
Now, let me just say it again for writing a for loop.
We need to specify the four key.
Then we need to have three statements inside this one is condition this when we are setting the variable,
it will run only once this is the condition.
And this is what the increment of the variable I know very well I can be G and if we use GE, we can
need to change it everywhere.
So why we use AI?
Well in every textbook that you're going to do, in every programming language that you're going to
start with.
So I do use as an index.
Right.
So that's why I'm using it today, because in most of tutorials or anything that you're going to start
even in textbooks, you're going to see they're using I OK now how this works.
So I the condition and let's do the first loop.
So this will be set to zero now the condition will be checked.
Zero is I, the condition is zero is smaller than five, which is will be true.
And that's why it's going to go inside here.
Then the console lock will be print because this is the only line of code that we have here.
And then the AI plus plus will be increment.
So the AI value of I will be incremented by one only right now for the next loop.
So I will be one because we incremented on the last step.
So the condition I want is Erdan five is going to be true.
Consultant don't look I sorry.
And then incremented so I will be two now on the next step.
Same same.
And when we have four right now we four is smaller than five then returns through the console log of
this one is executed in AI plus plus becomes five now five five is smaller than five which is false
and that will break out of the loop and the loop will stop working.
Now ladies and gentlemen, you can break the loop for example, if you want, if you want to do that
intentionally, this loop can run forever and it will block your code.
It will block your computer.
It will.
It will mean.
It will dry your.
RAM and CPU and whatever, so please make sure that you set the condition right, because if you set
the condition very differently than this one, then it can continuously running or even if you copy
the same one with different condition and you put it in the browser, the browser will get stuck and
it will crash eventually.
OK, so I've told you all of this now how we can implement it with the cars array.
Well, let's ride.
For example, now for variable of J is equal to zero.
Now I'm going to change it because I told you it can be different.
J Smaller than not case are smaller than 11.
That was the length of the array.
Right.
And plus, plus.
OK, now, Conseil.
Lot of cars of G, so I need cars of G.
Well, the G will be zero in the first loop, right.
And it will print out cars of zero on the second loop because it will be incremental.
The condition will be true until it reach 11.
Right.
Actually, we don't we don't need yet.
Let's see what will happen, so I'm going to save it and this will run until this condition is true.
Save and now we do have SAP, Volvo, BMW, Audi, and the last one is Mercedes.
And these are all of our items here and our loop is working.
So again, when you zero, it will be cars of zero.
Then on the next loop it will be cars.
So one of the next cars of of two, three, four, five, six, seven, eight, nine, 10 when it reaches
the eleven, eleven is not smaller than 11.
It will break the loop.
But what about I don't want to use if you don't want to use this fixed size here.
Well if you go back here.
You will see that we have length of 11, right, so we can use cars the length and that will save us
calculating how many indexes we do have and it will produce the same result.
Very good.
Next loop is.
Sorry, while you now don't write anything until I say you need to write because you can block your
code.
So what we have here in a while, we start like this with that, while then in these records we set
the condition.
I is smaller than five right now, cause a lot of I don't save anything if you do to get if you type
to get on with me, please just wait.
Now, I do have only the condition here, the same condition that I do have here.
Right.
But where is I.
So in order to use I we need to set the eye outside of the while loop condition.
I mean, outside of the wire in the last parameter that we need to set, we need to increment the I
for one and that should be inside the this code of light.
So save it now.
It will work and it will go zero, one, two, three and four.
That is pretty much it.
Now if you don't specify this and you delete it, for example, this line here and you save it and you
try to run it, then you will see that your computer will stack y well, because I is going to be always
smaller than five and I will never be incremented by one.
Right.
And this will be always true and it will loop until infinity or until your computer crash.
Very good.
Next one.
Do while.
Now why we need to do while.
Well, do.
And I'm say Conjola, lot of K, let's say Kay here, Kay, plus, plus, so we do have Samia's while
conditio, we do have Kay plus plus inside and we need to specify Kay outside here globally.
Very good now.
One more thing that I do while so in while statement, I said the condition K is smaller than five,
let's make it smaller than 10.
OK, now how this will work.
So if I save it, I will see from zero until nine.
Let me just do this.
Console that lock.
Do while loop.
Very good and.
But to here only while loop so you can see what was happening.
Very good.
So I have a while loop and I have do while loop in.
I have here space.
That's why it doesn't look very charming.
OK, so but what somebody will ask me, what's the difference between this one and this one.
Except I could do before that and while loop at there so.
Do while loop is different than this one, because this code of black will be executed only once, even
if the condition is not true, for example, K is zero, zero is smaller than 10, and it will work.
But if Keesey level is ten, ten is not smaller than 10.
Let me just do this.
So I will say ten here.
Right.
So the condition is not true.
And here, if I put far I is equal to five, this will never run.
But look at what will happen with the wire loop.
So it will print out the ten only why this is happening, well, because we print out the ten, so do
while Loop will get inside this block here and it will run at least once, then it will check the condition.
The condition is not true and then it will stop the whilom.
So you used the while when you want to run the code inside this body at least once.
But with while you can do that, you check the condition before it.
And same with four.
That is pretty much it for these loops.
Let me just explain one more thing, and that is for each let me just write it here for each.
Good.
So how do we forage well, for each is pretty much the same as a for just more nicer looking and very
easy to understand.
So let me just write this index, a red dot for each, then I have function inside, then I have in
function.
I have access to the current value to I or index.
Let me just write it like this and to the array.
And after that I do have this function.
So you don't need to know all of these things.
Right.
So we're not there yet, but I'm just going to explain it to you anyway.
So what is happening here?
What is required to have in this one?
So the current value is something that is required and that's a value of these current elements that
we are looking at.
Actually, the value of this.
Right?
The index is optional.
In the array's option, but if we need the index, we also have index of this one.
So for each loop's are the same as Falu.
So let me just write it like this.
For each so if you do if you just type for which you will, you should have something similar, right?
So if you click it, it will autocomplete it so.
This is one way of defining it.
Let me just show it to you cause because that's very so cars that for each.
Then we have the element access to the current element, we can change the name to current element,
right.
And let's do cancel that lock current and see what will happen.
Very good.
Now, I do have print out all the values of the foreach, so I don't see an implementation of I j k.
Right.
So how is this?
This is working.
But somebody will say, listen, this is more complex for me because here we are using a function now.
Also, another way to write a feature for each loop is cardstock for each and inside.
You can see function
in Element.
And then what we can do, console lock off element, right, or the current element.
So let me just right here console that log for each loop so you can distinguish the both of them because
you need to know if it's working.
Here it is.
ForEach loop in the loop through all of it with the help of a function.
Right.
And if I want to access the index, here you go.
I bam, I do have the indexes, but it's always good idea to put it here as well.
Right.
Nice.
And also here.
So current element.
Now what I need to do in order to access the current element in index, I need to put this one in brackets
and I will see index here.
And I can print it out here index as well.
Let me just show it to you.
Very good.
Now it's working.
So that was not information.
I know, but this is a footage.
We're going to do more details in future.
And they do have access to current value, to the index, to the rate, and it's pretty much more readable.
So we just plugging the, um, the array here and we let the foreach to do its job.
And also what we can do, because we have access to the function and that function has access to the
element in the index, what we can do, we can cut out this function here, make sure that you put a
semicolon there.
You can cut out of this function and put it here, except I need to name this function and say array
the loop array, for example, and I'm going to pass the function here, loop array.
So it should work now again.
Oops.
Sorry.
There you go for each loop, it is working, so we have the function outside and we can just plug it
here and that is giving us very, very good way of solving things.
And if we want to use the same function everywhere on other plays, then we can do that.
But it's very much that what I want to say about it.
So it's nice Mother and is readable.
And it was a new addition to the ECMAScript before we just used for it.
For now we have a fridge and we have access to the function and that function have access to the criminal
element index and the entire array.
So if we need, we can access this entire area.
But at this stage, this is pretty much, you know, so wrap your head around the for do while and while
and also make sure that you understand how this is working.
So that is pretty much it for this lecture.
I hope you enjoy it and I will see you in the next one.