Labels

Creating code with three different types of loops (While / For / Do..While)

 



Loop statement in programing language is very handy. There may be a situation when you need to execute codes or group of statements multiple times. Loops allow us for more complicated execution paths. In this blog post, I will explain three different types of loops: while loop, for loop, and do/while loop.



## While Loop

A while loop statement repeatedly executes a block of code as long as a given condition is true.

while ([condition]) {
  [loop body]
}

The condition in the while loop statement is boolean expression. When executing, if the condition is true, the loop body will be executed. It will repeat as long as the expression result is true.


// example

const gifts = ["candle", "book", "ring"]

function wrapGifts(products) {
 
  let i = 0  // the initialization is OUTSIDE the body of the loop
 
  while (i < products.length) {
    console.log(`Wrapped ${products[i]} and sent.`)
    i++  // the iteration is INSIDE the body of the loop
  }

  return products

}


wrapGifts(gifts)
// log: Wrapped candle and sent.
// log: Wrapped book and sent.
// log: Wrapped ring and sent.
// ["candle", "book", "ring"]

  • Initialization is outside the loop body.
  • Iteration is inside the loop body.



## For Loop

The for statement creates a loop with 3 expressions.

for ([initialization]; [condition]; [iteration]) {
  [loop body]
}

A for loop is useful when you know how many times a task is to be repeated.


// example

const gifts = ["candle", "book", "ring"]

function wrapGifts(products) {
 
  for (let i = 0; i < products.length; i++) {
    console.log(`Wrapped ${products[i]} and sent.`)
  }

  return products

}


wrapGifts(gifts)
// log: Wrapped candle and sent.
// log: Wrapped book and sent.
// log: Wrapped ring and sent.
// ["candle", "book", "ring"]

A for statement can be simplified with for/of or for/in statement. The for/of statement loops through the properties of an array, and for/in statement loops through the properties of an object.


// for/of statement

for (const element of array) {
  [loop body]
}


// for/in statement

for (const key in object) {
  [loop body]
}

The example above can be simplified to the following using for/of statements:

const gifts = ["candle", "book", "ring"]

function wrapGifts(products) {
 
  for (const element of products) {
    console.log(`Wrapped ${element} and sent.`)
  }

  return products

}

  • Initialization, condition, and iteration are initially executed in order.
  • Each step ends with a semicolon (;)
  • Iteration can be left blank with a semicolon at the end.



## Do/While Loop

A do/while loop is similar to a while loop, except that a do/while loop is always executed at least once.

do {
  [statements]
}
while ([condition])

Because the boolean expression appears at the end of the loop, the statements in the loop execute once before the expression is tested.


// example

let text = ""
let i = 1;

do {
  text += "The number is " + i;
  i++;
}
while (i < 4);


// The number is 1
// The number is 2
// The number is 3

  • Initialization is outside the loop.
  • Iteration is inside the do statement.
  • Condition is inside the while statement.
  • The loop is always executed at least once.





Labels: