Question:

What is a loop?

Answer:

A fancy programmers' word for loop is: iteration. It simply means to repeat executing the same lines of code over and over. With any luck, at some point the repetition, or iteration, will stop. Otherwise you wind up with what is called an infinite loop, which is one of the errors mentioned on my "Common Mistakes" page.

Question:

What is the general structure of a loop?

Answer:

Just like functions, the basic structure of a loop is a header and body. The header consists of the loop name and an expression inside parentheses. The body is enclosed in curly-braces. Code that you want executed by the loop is placed inside the body.

Question:

How many different kinds of loops are there in JavaScript?

Answer:

JavaScript has 4 different loops available to programmers:
    for
    while
    do-while
    for-in

Learn the syntax for each loop:

Loops Syntax

Question:

Can I write a loop inside another loop?

Answer:

Yes, that is called nesting. The inside loop is the nested loop. You can nest more than one level, that is: you can write a loop inside a nested loop. If you find yourself nesting loops too many levels deep, you should consider redesigning your code.

You can also nest more than one loop inside the same outer loop. For example: you could have an outer while loop with a for loop inside, followed by another for loop (inside the outer loop) that is not nested inside the first for loop.

Question:

Is there a way to stop execution of a loop before the conditional section is false?
Note: The conditional section is described on the Loops-Syntax page, available by clicking on the above link.

Answer:

You can insert the keyword "break", followed by a semicolon anywhere in the body of your loop, and the loop will stop execution immediately. Example:

    for (var n = 0; n < myArrObj.length; n++)
    {
        // insert code here
        if (something == somethingElse)
        	break;
    }
    

Question:

Is there any other way to manipulate a loop?

Answer:

The last keyword associated with loops is: "continue". continue immediately takes you to the conditional section, and if true your loop runs again from the top of the curly-braces (the body of your loop). continue does not reset your counter, that is incremented normally from its current count. Other than affecting the flow as described above, continue does not manipulate your code in any other way. Example:

    var myStopAmount = 0;
    for (var n = 9; n >= myStopAmount; n--)
    {
    
        // code above here will always execute
        if (something == somethingElse)
        	continue;
        // code below here may or may not execute
        // depending on whether "continue" is invoked or not
        
    }
    

Question:

When and why should I use a loop?

Answer:

Loops might be used to total the numbers in a table row or column. Loops might be used to collect answers (input) from someone visiting your website. Loops are a great way to iterate through elements of an array.

Question:

How do I know which loop to use?

Answer:

That is a design choice that comes with experience. Generally: If you want to loop through all elements in an array, a for-in loop is a good choice. If you know how many times you want to do something, a for loop is a good choice. If you want to execute your code at least one time, a do-while loop is a good choice. If you want to keep repeating something as long as certain conditions are met, a while loop is a good choice.

Note:

If the body of your loop has only one line of code (one semicolon), you do not need curly-braces, but it is a good idea to use them anyway. You will be surprised how many times you want to add code to a loop that you originally thought needed only one line.

Caution:

Do not forget to increment your counter, otherwise the conditional section may always be true, leading to the dreaded "infinite" loop.

Finally:

DO NOT place a semicolon after your parentheses! That will break your loop. In essence, that detaches the code inside the curly-braces from your loop, so that code no longer belongs to your loop, and the semicolon itself is the only code that belongs to your loop.

Real world example using loops:

Loops Real World

Next Loops: Syntax »