Latest web development tutorials

JavaScript Tutorial

JavaScript Tutorial JavaScript Introduction JavaScript usage JavaScript Output JavaScript grammar JavaScript Statement JavaScript Notes JavaScript variable JavaScript type of data JavaScript Object JavaScript function JavaScript Scope JavaScript event JavaScript The string JavaScript Operator JavaScript Comparison JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript Type conversion JavaScript Regular Expressions JavaScript error JavaScript debugging JavaScript Variable promotion JavaScript Strict mode JavaScript Use errors JavaScript Form validation JavaScript Keep the keyword JavaScript JSON JavaScript void JavaScript Code specification

JS function

JavaScript Function definition JavaScript Function parameter JavaScript Function call JavaScript Closure


DOM Introduction DOM HTML DOM CSS DOM event DOM EventListener DOM element

JS Advanced Tutorial

JavaScript Object JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp Object

JS Browser BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript Pop-ups JavaScript Timing events JavaScript Cookies

JS Library

JavaScript Library JavaScript test jQuery JavaScript test Prototype

JS Examples

JavaScript Examples JavaScript Object instance JavaScript Browser object instance JavaScript HTML DOM Examples JavaScript to sum up

JS Reference Manual

JavaScript Object HTML DOM Object

JavaScript for loop

The cycle can execute a block of code a specified number of times.

JavaScript cycle

If you want to run over and over again the same code, and each of the values ​​are different, then the use of the cycle is very convenient.

We can output an array of values:

General wording:

document.write(cars[0] + "<br>");
document.write(cars[1] + "<br>");
document.write(cars[2] + "<br>");
document.write(cars[3] + "<br>");
document.write(cars[4] + "<br>");
document.write(cars[5] + "<br>");

Using for loop

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

try it"

Different types of cycle

JavaScript support different types of loops:

  • for - a certain number of cycles code block
  • for / in - loop through the properties of an object
  • while - when a specified condition is true cycle specified block of code
  • do / while - also when the specified condition is true cycle specified block of code

For loop

for loop is that you want to create a loop often used tool.

Here is the syntax for loop:

for (语句 1; 语句 2; 语句 3)

Statement 1 (block) starts before you begin.

Statement 2 defines the operating cycle (block) conditions

3 statement after the loop (block) has been doing


for (var i=0; i<5; i++)
    x=x + "该数字为 " + i + "<br>";

try it"

From the example above, you can see:

Statement 1 set the variable before the loop starts (var i = 0).

Statement 2 defined conditions Cycle run (i must be less than 5).

Statement 3 increased by a value (i ++) after each block of code has been executed.

Statement 1

Normally we would use a statement to initialize the variables used in the cycle (var i = 0).

1 statement is optional, that is not used can also be a statement.

You can initialize any statement 1 (or more) values:


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

try it"

And you can also omit a statement (such as in the beginning of the loop has been set value):


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

try it"

Statement 2

Statement 2 conditions generally used to assess the initial variables.

2 The same statement is optional.

2 If the statement returns true, then the cycle starts again if it returns false, the loop will end.

lamp If you omit the statement 2, it must provide a break in the cycle. Otherwise, the cycle will not be able to stop. This makes it possible to make the browser to crash. Please read about the break in a later section of this tutorial.

Statement 3

3 statements generally increases the value of the original variable.

Statement 3 is also optional.

Statement 3 has a variety of uses. Increment can be negative (i--), or more (i = i + 15).

Statement 3 may be omitted (eg inside the loop when there is a corresponding code):


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

try it"

For / In cycle

JavaScript for / in statement to loop through object properties:


var person={fname:"John",lname:"Doe",age:25};

for (x in person)
    txt=txt + person[x];

try it"

You will learn more about in the section on JavaScript for object / in the knowledge cycle.

While loop

We will explain to you while loop and do / while loop in the next chapter.