Loops
Table of contents
If you want to print "Hello World!" 1000 times how will you do it? maybe you'll type console.log("Hello World!") 1000 times or maybe you'll copy-paste it. but in javascript, there is an easy way to do this, which is loops.
loops can execute blocks of code multiple times. Even if you want to execute a block each time with a different value.
There are 5 different types of loops in javascript:
for loop:
The for statement creates a loop with 3 optional expressions.
Syntax:
for (expression1; expression2; expression3){
//code to be executed
}
Example:
//this code print numbers from 1 to 10.
for (i=1; i<11 ; i++){
console.log(i)
}
How for loop work? :
In the above example, we have initialized a variable (i) in expression 1 whose value is going to change throughout the code.
Next, we gave a condition to our variable( i<11 ) in expression 2 which will run the block of code if the condition is true.
Then in expression 3 we gave the increment operator to our variable which will increment the value until the condition(expression2) becomes false.
now let's see the behind-the-scenes of for loop by using conditional statements
//behind the scenes of for loop
let i=1 //expression1 in for loop
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
// Now you have to type this until the value of i becomes 11
// No need to read remaining code i just copy-pasted above code for 9 more times
//No need to update variable again and again. increment operator will change the value of variable automatiaclly
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
if (i<11) /*expression2 */ {
console.log(i) //block of code to be executed
i++ //expression3
}
// above code will simply print the number from 1 to 10
It was a lot of code to type but for loops make it easy to read and work more efficiently.
for in loop:
for in loops are the advanced version of for loops. they are used to run for loop for keys in an object.
Syntax:
//let object ={some key-value pairs}
for (x in object) {
code block to be executed
}
Example:
let userInfo={
username:"Virat Kohli",
userage: 34
}
for (let a in userInfo){
console.log(a) //this will only print keys in object & not values
}
for in loops also works for arrays.
for of loop:
for of loops are used to run for loop for arrays and strings.
Syntax:
for (x of iterable) {
//block of to be executed
}
Example:
for (let a of "Virat Kohli"){
console.log(a)
}
while loop:
while loops are pretty much similar to for loop the only difference is the syntax.
Syntax:
let expression1 // variable declaration
while (expression2)/*condition for variable */ {
//block of code to be executed
expression3 // operator
}
if you don't give a valid operator to loop or if the condition for loop never becomes false then it will run the code infinitely causing the browser to crash.
Example:
//this code print numbers from 1 to 10.
let i =1
while (i<11){
console.log(i)
i++
}
for loops and while loops are similar to each other so it doesn't matter which loop to use. It all depends on you, which loop you want to use.
do while loop:
do-while loops are used to run a block of code once, no matter if the condition is true or false.
Syntax:
do {
//block of code to be executed
}
while (condition);
Example:
let i=1
do{
console.log(i)
i++
}
while(i<11)