Loops
- Loops are used in programming to automate repetitive tasks.
- Most of the activities we do in life are full of repetitions. Imagine if I ask you to print out from 0 to 100 using console.log().
- To implement this simple task it may take you 2 to 5 minutes, such kind of tedious and repetitive task can be carried out using loop.
For Loop
- The for statement is a type of loop that will use up to three optional expressions to implement the repeated execution of a code block.
// syntax:
for (initialization; condition; increment / decrement) {
// code to be executed
}
Example:
// Initialize a for statement with 5 iterations
for (let i = 0; i < 4; i++) {
// Print each iteration to the console
console.log(i);
}
// Output
// 0
// 1
// 2
// 3
explanation
- we initialized the for loop with let i = 0, which begins the loop at 0.
- We set the condition to be i < 4, meaning that as long as i evaluates as less than 4, the loop will continue to run.
- Our i++ increments the count for each iteration through the loop.
- The console.log(i) prints out the numbers, starting with 0 and stopping as soon as i is evaluated as 4.
for..in
- The for...in statement iterates over the properties of an object.
// for...in
const shark = {
species: "great white",
color: "white",
numberOfTeeth: Infinity
}
- Using the for...in loop, we can easily access each of the property names.
// Print property names of object
for (attribute in shark) {
console.log(attribute);
}
// Output
// species
// color
// numberOfTeeth
// Print property values of object
for (attribute in shark) {
console.log(shark[attribute]);
}
// Output
// great white
// white
// Infinity
// Print names and values of object properties
for (attribute in shark) {
console.log(`${attribute}`.toUpperCase() + `: ${shark[attribute]}`);
}
// Output
// SPECIES: great white
// COLOR: white
// NUMBEROFTEETH: Infinity
For…Of
- The for...of statement is a newer feature as of ECMAScript 6.
- we will create an array and print each item in the array to the console
// Initialize array of shark species
let sharks = [ "great white", "tiger", "hammerhead" ];
// Print out each type of shark
for (let shark of sharks) {
console.log(shark);
}
// Output
// great white
// tiger
// hammerhead
// Loop through both index and element
for (let [index, shark] of sharks.entries()) {
console.log(index, shark);
}
// Output
// 0 'great white'
// 1 'tiger'
// 2 'hammerhead'
- It is also possible to print out the index associated with the index elements using the entries() method.
While Loop
- while statement is a loop that executes as long as the specified condition evaluates to true.
- The syntax is very similar to an if statement, as seen below.
// while loop
while (condition) {
// execute code as long as condition is true
}
- The while statement is the most basic loop to construct in JavaScript
// Set population limit of aquarium to 10
const popLimit = 10;
// Start off with 0 fish
let fish = 0;
// Initiate while loop to run until fish reaches population limit
while (fish < popLimit) {
// add one fish for each iteration
fish++;
console.log("There's room for " + (popLimit - fish) + " more fish.");
}
// Output
// There's room for 9 more fish.
// There's room for 8 more fish.
// There's room for 7 more fish.
// There's room for 6 more fish.
// There's room for 5 more fish.
// There's room for 4 more fish.
// There's room for 3 more fish.
// There's room for 2 more fish.
// There's room for 1 more fish.
// There's room for 0 more fish.
Do…While Loop
- which is very similar to while with the major difference being that a do...while loop will always execute once, even if the condition is never true.
do {
// execute code
} while (condition);
// Set variable to 0
let x = 0;
do {
// Increment variable by 1
x++;
console.log(x);
} while (false)
// Output
// 1
- the do portion of the loop comes first, and is followed by while (condition)
- The code block will run, then the condition will be tested as it is in a normal while loop
break
- Break is used to interrupt a loop
for(let i = 0; i <= 5; i++){
if(i == 3){
break
}
console.log(i)
}
// 0 1 2
- The above code stops if 3 found in the iteration process.
continue
- We use the keyword continue to skip a certain iterations.
for(let i = 0; i <= 5; i++){
if(i == 3){
continue
}
console.log(i)
}
// 0 1 2 4 5
Do leave your comments