JavaScript Tutorial/Statement/For Loop
Содержание
- 1 Check the loop counter
- 2 Counting backward through a for loop
- 3 for Loops
- 4 For loop with undeclared loop counter
- 5 Multiplication Table Generator by using for loop
- 6 Reversed for loop
- 7 Set loop step to 5 in for loop
- 8 Use for statement to loop through all elements in an array
- 9 Using the JavaScript for Loop
Check the loop counter
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
for (var i = 1; i < 101; i++) {
if (i == 99) {
alert("The number is " + i);
}
}
</script>
</body>
</html>
Counting backward through a for loop
<html>
<head>
<title>Back Racer</title>
<script>
var i = 0;
for (i = 10; i > 0; i--){
alert(i);
}
</script>
</head>
<body>
</body>
</html>
for Loops
The for loop is a structure that loops for a preset number of times.
The for loop is made up of two parts: condition and statement.
The condition structure determines how many times the loop repeats.
The statement is what is executed every time the loop occurs.
The condition structure is contained within parentheses and is made up of three parts.
Each part is separated by a semicolon (;).
The first part of the condition structure initializes a variable to a starting value.
In most cases, the variable is declared within this section as well as initialized.
The second part is the conditional statement.
The third and final part determines how the variable should be changed each time the loop is iterated.
The format of the for loop looks like the following:
for (initialize; condition; adjust) {
statement;
}
For loop with undeclared loop counter
<HTML>
<HEAD>
<SCRIPT language="JavaScript">
<!--
for (count=1;count<16;count+=1)
{
document.write(count+". This is getting way too repetitive.<BR>");
}
//-->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
Multiplication Table Generator by using for loop
<html>
<head>
<title>Multiplication Table Generator</title>
<script language="javascript" type="text/javascript">
<!--
function generateTable()
{
var myVar = prompt("A number?", "");
var myString = "";
for (i=1; i<=6; i++) {
myString += i+ " x " +myVar+ " = " +(i*myVar)+ "\n";
}
alert(myString);
}
//-->
</script>
</head>
<body>
<a href="javascript:generateTable()">Create New Table</a>
</body>
</html>
Reversed for loop
<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
<!--
for (x = 10; x >= 0; x = x - 2)
{
document.write(x);
}
// -->
</script>
</head>
<body>
</body>
</html>
Set loop step to 5 in for loop
<html>
<head>
<title>Count By Five</title>
<script>
var i = 0;
for (i=5; i <= 100; i += 5){
alert (i);
}
</script>
</head>
<body>
<h1>Count By Five<br></h1>
</body>
</html>
Use for statement to loop through all elements in an array
<html>
<head>
<title>Use for statement to loop through all elements in an array</title>
</head>
<body>
<P>
<script language="javascript" type="text/javascript">
<!--
var myArray = new Array();
myArray[0] = "AAA";
myArray[1] = "BBB";
myArray[2] = "CCC";
for (var i=0; i<myArray.length; i++) {
document.write("Element " +i+ " contains: " +myArray[i]+ "<br />");
}
//-->
</script>
</p>
</body>
</html>
Using the JavaScript for Loop
<HTML>
<HEAD>
<TITLE>
Using the JavaScript for Loop
</TITLE>
</HEAD>
<BODY>
<H1>Using the JavaScript for Loop</H1>
<SCRIPT LANGUAGE="JavaScript">
<!--
var i, total
total = 0
for (i = 1; i < 5; i++) {
total += i
document.write("Loop iteration " + i + " (Cumulative total = " + total + ")<BR>")
}
// -->
</SCRIPT>
</BODY>
</HTML>