Loops

 

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