Introduction
In programming, a loop is like a helpful assistant that repeats a task until a specific condition is satisfied. Think of it as a computer doing something over and over until it's told to stop. This repetitive action is handy when we want to work through a list of things, like numbers or words, one at a time. So, loops make it easy for us to access and deal with each item in a group. It's like having a virtual helper do a task repeatedly until it's done, making our coding lives a bit simpler!
Types of loop in JavaScript:
- for
- for/in
- for/of
- while
- do/while
Each loop in programming has its own job, but you can mix and match them for different tasks. The 'for loop' is super popular, especially in JavaScript — it's used a lot. Even though each loop has its unique role, they're not super different from one another. They follow similar rules, making it easy for programmers to switch between them and use the right one for the job.
Sure, let's simplify that:
Let's write some code to learn how it works.
for (let i = 0; i < 5; i++) {
console.log(i);
}
// output = 0, 1, 2, 3, 4
This is called a for loop, and it's pretty easy. Let's break it down to understand it better.
let i = 0: This is where the loop starts. i is like a counter, and it begins at 0.
i < 5: This is when the loop stops. It keeps going as long as i is less than 5.
i++ (or i+=1): This is how much i increases each time the loop goes around. It usually increases by 1. You can change this to make it increase by more, like i+=2 for 2 steps or i+=3 for 3 steps each time.
So, in simple terms, the loop starts at 0, continues as long as the number is less than 5, and increases by 1 each time.
Examples:
for (let i = 0; i < 5; i++) {
console.log(i)
}
// output = 0, 1, 2, 3, 4
for (let i = 0; i < 5; i += 2) {
console.log(i)
}
// output = 0, 2, 4; // Takes two steps each time
Remember: instead of i, you can use any other word, and it will still work the same. However, i is recommended.
Examples:
for(let i = 0; i < 5; i++) {
console.log(i)
}
// Output = 0 1 2 3 4;
for(let c = 0; c < 5; c++) {
console.log(c)
}
// Output = 0 1 2 3 4;
Using the for loop backward:
We can make the loop go backward by modifying it. It works the same way but starts from the end and goes to the top. Let's write code to understand it:
for(let i = 5; i >= 0; i -= 1) {
console.log(i);
}
// Output: 5, 4, 3, 2, 1, 0
You can also make the loop take bigger steps, like i -= 2 or i-= 3 instead of i -= 1. 1
If you want to learn how to use a for loop with an array, check out this article on Playing with Arrays using For Loop.