Javascript For loop, While loop, Do-While loop syntax or statement

Please visit my new Web Site https://coderstechzone.com

First of all what is loop or iteration? Loop is used for executing a set of statements or instructions repeatedly until a specific condition is false. To perform the repeated task like other programming languages Javascript provides us loop. If we needs to run multiple statement within a loop then the statements must be enclosed within the loop body by using braces { and }. Keep in mind two things when you want to write loop statement are:

1. Statements that you need to iterate.
2. Termination or exit from loop. This is must otherwise infinite loop may hang.

In Javascript there are 3 different type of loops:
1. for loop : Specified number of times.
2. while loop : While condition is true.
3. do-while loop : First time must execute then loops while condition is true.

In this post i also want to discuss on the following topics:
1. BREAK Statement to exit from a loop
2. Inner loop or Nested loop

For loop Syntax & Example:
The basic syntax for the "for loop" statement is given below:

for (Initialization; Condition; Increment/Decrement)
{
...
statements
...
}

Example:

<script type="text/javascript">
// This is the incremental for loop
document.write("***** Start For loop *****</br>");
for(i = 0; i < 5; i++)
{
document.write("Iteration Number = " + i+"</br>");
}
document.write("***** End For loop *****");
</script>

<script type="text/javascript">
// This is the decremental for loop
document.write("</br>***** Start For loop *****</br>");
for(i = 4; i >= 0; i--)
{
document.write("Iteration Number = " + i+"</br>");
}
document.write("***** End For loop *****");
</script>

Display:

***** Start For loop *****
Iteration Number = 0
Iteration Number = 1
Iteration Number = 2
Iteration Number = 3
Iteration Number = 4
***** End For loop *****


***** Start For loop *****
Iteration Number = 4
Iteration Number = 3
Iteration Number = 2
Iteration Number = 1
Iteration Number = 0
***** End For loop *****

While loop Syntax & Example:
The basic syntax for the "while loop" statement is given below:

while (Condition)
{
...
statements
...
}

Example:

<script type="text/javascript">
// This is the incremental for loop
var i=0;
document.write("***** Start While loop *****</br>");
while(i < 5)
{
document.write("Iteration Number = " + i+"</br>");
i++;
}
document.write("***** End While loop *****");
</script>

<script type="text/javascript">
// This is the decremental for loop
var i=4;
document.write("</br></br></br>***** Start While loop *****</br>");
while(i >= 0)
{
document.write("Iteration Number = " + i+"</br>");
i--;
}
document.write("***** End While loop *****");
</script>

Display:
Same as for loop.

Do-While loop Syntax & Example:
Do while loop must perform first time. After that it will check the while loop condition & execute until condition is false. The basic syntax for Do-While loop is given below:

do{
...
statements
...
}while (Condition)

Example:

<script type="text/javascript">
// This is the incremental do while loop
var i=0;
document.write("***** Start Do While loop *****</br>");

do{
document.write("Iteration Number = " + i+"</br>");
i++;
}while(i < 5)
document.write("***** End Do While loop *****");
</script>

<script type="text/javascript">
// This is the decremental do while loop
var i=4;
document.write("</br></br></br>***** Start Do While loop *****</br>");

do{
document.write("Iteration Number = " + i+"</br>");
i--;
}while(i >= 0)
document.write("***** End Do While loop *****");
</script>

Display:
Same as above.

Using BREAK Statement:
Most often we need to exit from a loop when any one condition from a set of terminating condition is meet. In the following example i will show you how we can exit from a "For loop" by using BREAK statement.

Example on BREAK Statement:

<script type="text/javascript">
document.write("</br></br></br>***** Start For loop*****</br>");
for(i = 0; i < 5; i++)
{
document.write("Iteration Number = " + i+"</br>");
// want to exit for loop when i = 3
if(i==3)
break;
}
document.write("***** End For loop *****</br>");
</script>

Display:

***** Start For loop*****
Iteration Number = 0
Iteration Number = 1
Iteration Number = 2
Iteration Number = 3
Exit for loop.....
***** End For loop *****

Nested Loop/Inner Loop:

<script type="text/javascript">
document.write("***** Start For loop for i *****</br>");
for(i = 0; i < 3; i++)
{
document.write("</br>");
document.write("Iteration Number for I = " + i+"</br>");
document.write("***** Start For loop for j while i="+i+" *****</br>");
// This is the nested for loop
for(j=0;j<2;j++)
{
document.write("Iteration Number for j = " + j+"</br>");
}
document.write("***** End For loop for j while i="+i+" *****</br>");
document.write("</br>");
}
document.write("***** End For loop *****</br>");
</script>

Display:

***** Start For loop for i *****

Iteration Number for I = 0
***** Start For loop for j while i=0 *****
Iteration Number for j = 0
Iteration Number for j = 1
***** End For loop for j while i=0 *****


Iteration Number for I = 1
***** Start For loop for j while i=1 *****
Iteration Number for j = 0
Iteration Number for j = 1
***** End For loop for j while i=1 *****


Iteration Number for I = 2
***** Start For loop for j while i=2 *****
Iteration Number for j = 0
Iteration Number for j = 1
***** End For loop for j while i=2 *****

***** End For loop *****

Examine the output for the above example you will found that for each iteration of i, j executed two times.

Javascript IF ELSE IF conditional statement with AND OR NOT Operator

Please visit my new Web Site https://coderstechzone.com

For a javascript beginner, understanding the if-else conditional statement is the first task. Since no one can start to write any logic witout IF ELSE statement so why do not start from very basic. In this post i will try to give you a complete understaning on IF - ELSE conditional statement with AND OR NOT operator to build up the logic. For an example we have 3 requirements like:

1. I will pass a number to a function. The function give an alert if the supplied number is MAX.
2. I will pass a number to a function. The function give an alert if MAX otherwise Not MAX.
3. I will pass a number to a function. The function give an alert for MAX, MIN or EQUAL.

IF Statement:
Look at our first requirement. Here if we think normally then the answer will be we need to alert only if the supplied number is greater than function local variable. So to implement the above requirement we need to write an IF Statement like:

<script type="text/javascript">
function AlertMAX(nNumber)
{
var nFixNumber=100;
if(nNumber>nFixNumber)
alert ('Your supplied number '+nNumber+' is MAX.');
}

AlertMAX(200);
</script>

If...else Statement:
Look at the second requirement. Here if the supplied number is greater than the function defined fix loocal variable then we need to alert by 'MAX' otherwise 'Not MAX'. So in this scenario we can't build the logic without else satement. The code looks like:

<script type="text/javascript">
function AlertMAX(nNumber)
{
var nFixNumber=100;
if(nNumber>nFixNumber)
alert ('Your supplied number '+nNumber+' is MAX.');
else
alert ('Your supplied number '+nNumber+' is Not MAX.');
}

AlertMAX(50);
</script>

If...else if...else Statement:
Now look at the requirement number three. Here if the supplied number is MAX then we need to alert 'MAX' else if the supplied number is equal than we need to alert 'EQUAL' else definitely 'MIN'. So the code will be:

<script type="text/javascript">
function AlertMAX(nNumber)
{
var nFixNumber=100;
if(nNumber>nFixNumber)
alert ('Your supplied number '+nNumber+' is MAX.');
else if(nNumber==nFixNumber)
alert ('Your supplied number '+nNumber+' is EQUAL.');
else
alert ('Your supplied number '+nNumber+' is MIN.');
}

AlertMAX(100);
</script>

Now we have learned the basic structure of IF..ELSE conditional statement with proper example. But in our real lives logic building is not an easy job. To build up logic we need more complex conditional statement. Now i like to discuss how we can apply AND OR NOT operator to build up a logic.

IF statement with AND operator:
Let we have a requirement like: We will pass an employee service length to a javascript function & the function will give us a message 'One Basic' if the service length is between 0 to 5. 'Three Basic' if the service length between 6 to 10. Otherwise 'Five Basic'. So if you simply think you can understand here we need AND operator to build the logic. Javascript syntax for AND operator is &&. The code looks like:

<script type="text/javascript">
function AlertGratuity(nYear)
{
if(nYear<=5) alert ('One Basic'); else if(nYear>5 && nYear<=10) alert ('Three Basic'); else alert ('Five Basic'); } AlertGratuity(7); </script>

IF statement with OR operator:
Let we have a requirement like: We will pass an employee service length and designation to a javascript function & the function will give us a message 'Three Basic' if the service length is greater than 5 years OR he is a Manager. Otherwise 'One Basic'. So if you simply think you can understand here we need OR operator to build the logic. Javascript syntax for OR operator is . The code looks like:

<script type="text/javascript">
function AlertGratuity(nYear,sDesig)
{
if(nYear>5 sDesig=='Manager')
alert ('Three Basic');
else
alert ('One Basic');
}

AlertGratuity(3,'Manager');
</script>

The output will be "Three Basic" since his designation is Manager.

IF statement with NOT operator:
Let we have a requirement that the company never give any gratuity if his service length less than 10 years. The syntax for NOT operator is !. So the code looks like:

<script type="text/javascript">
function AlertGratuity(nYear)
{
if(!(nYear>=10))
alert ('Not Eligible');
else
alert ('Eligible');
}

AlertGratuity(3);
</script>

Hope one can implement logic with Javascript IF..ELSE..IF...ELSE conditional statement as well as can use AND, OR & NOT opeartor.