Three key examples of js loops of for and while

  • 2020-12-21 17:57:00
  • OfStack

Three ways to write a cycle:


<!doctype html>
<title>js cycle  by  The home of the script </title>
<meta charset="utf-8"/>
<meta name="keywords" content="js cycle  by  The home of the script " />
<meta name="description" content="js cycle  by  The home of the script " />
</head>
<body>
//while cycle 
 <script type="text/javascript">
i = 1;
while (i <= 6)
{
document.write("<h" + i+"> Home of scripts, that's the title "+i);
document.write("</h"+i+">");
i++;
}
</script>
//do_whilel cycle 
<script type="text/javascript">
i = 1;
do
{
document.write("<h" + i+">ofstack.com , This is a title, "+i);
document.write("</h"+i+">");
i++;
}
while(i<=6);
</script>
//for cycle  
 <script type="text/javascript">
for(i=1;i<=6;i++)
{
 document.write("<h"+i+"> The home of the script , This is a title, "+i);
 document.write("</h"+i+">");
}
</script>
</body>
</html>


Different types of loops

JavaScript supports different types of loops:
The & # 8226; for - Fixed number of times to loop code block 1
The & # 8226; for/in - Loops through the properties of the object
The & # 8226; while - The block of code that loops when the specified condition is true
The & # 8226; do/while - Also the block of code that loops when the specified condition is true


For cycle

The for loop is a tool you will often use when you want to create a loop.

Here is the syntax for the for loop:

for (statement 1; Statements 2; Statement 3)
{
A block of code that is executed
}


Statement 1 is executed before the loop (block of code) begins
Statement 2 defines the conditions under which a loop (block of code) is run
Statement 3 is executed after the loop (block of code) has been executed

The instance


for (var i=0; i<5; i++)
  {
  x=x + "The number is " + i + "<br>";
  }

Try it for yourself

From the above example, you can see:

Statement 1 sets the variable before the loop begins (var i=0).
Statement 2 defines the conditions under which the loop runs (i must be less than 5).
Statement 3 adds a value (i++) after each code block has been executed.


Statements 1

Normally we use statement 1 to initialize the variable used in the loop (var i=0).

Statement 1 is optional, meaning you can do without it.

You can initialize any (or more) value in statement 1:

Example:


for (var i=0,len=cars.length; i<len; i++)
{
document.write(cars[i] + "<br>");
}

You can also omit statement 1 (for example, if a value has been set before the loop starts) :

Example:


var i=2,len=cars.length;
for (; i<len; i++)
{
document.write(cars[i] + "<br>");
}

Statements 2

Normally statement 2 is used to evaluate the conditions of the initial variable.

Statement 2 is also optional.
If statement 2 returns true, the loop starts again, and if false is returned, the loop ends.
Tip: If you omit statement 2, you must provide break within the loop. Otherwise you can't stop the loop. This can crash the browser. Read about break later in this tutorial.

Statement 3

Normally statement 3 increases the value of the initial variable.

Statement 3 is also optional.
Statement 3 can be used in several ways. The increment can be negative (i--) or larger (i=i+15).
Statement 3 can also be omitted (for example, when there is corresponding code inside the loop) :

Example:


var i=0,len=cars.length;
for (; i<len; )
{
document.write(cars[i] + "<br>");
i++;
}

For/In cycle

JavaScript for/in statement loops through the properties of the object:

The instance


var person={fname:"John",lname:"Doe",age:25};
for (x in person)
  {
  txt=txt + person[x];
  }

You will learn more about the for/in loop in the section on JavaScript objects.

Specific can refer to this article: https: / / www ofstack. com w3school/js/js_loop_for htm


Related articles: