For. With a for-loop, we have an efficient and standard looping construct. JavaScript engines optimize for-loops, so this performs well.
Loop notes. With while, another loop, we can do the same thing as for, but the syntax may be simpler when an endpoint is not known. So "while" is a good infinite loop.
For example. Consider this program. It uses a for-loop with the standard "i" induction variable. It uses the var keyword—this is an important JavaScript optimization.
Result The program begins at 0 and stops at 4. When "i" reaches 5, the loop is terminated before being run again.
// Loop over first 5 numbers and print them.
for (var i = 0; i < 5; i++) {
console.log("FOR-LOOP ITERATION: " + i);
}FOR-LOOP ITERATION: 0
FOR-LOOP ITERATION: 1
FOR-LOOP ITERATION: 2
FOR-LOOP ITERATION: 3
FOR-LOOP ITERATION: 4
While. Here we rewrite the first "for" loop into a while-loop. This version of the looping logic is somewhat harder to follow for both people and compilers.
So We usually prefer "for" when the end point is known. But for an infinite loop or one where we do not know here it stops, while is good.
// Use while-loop over first five numbers.
var i = 0;
while (i < 5) {
console.log("WHILE INDEX: " + i);
i++;
}WHILE INDEX: 0
WHILE INDEX: 1
WHILE INDEX: 2
WHILE INDEX: 3
WHILE INDEX: 4
For-of loop. This loop enumerates the elements in an array. It does not return indexes like for-in. It returns the actual elements in the array.
var numbers = [10, 20, 30];
// Loop over the numbers in the array.
for (var number of numbers) {
console.log("FOR OF: " + number);
}FOR OF: 10
FOR OF: 20
FOR OF: 30
For-in loop. This loop returns all the indexes of an array. So in an array of 3 elements, we get the indexes 0, 1 and 2. We can then access the elements themselves.
var numbers = [10, 20, 30];
// Loop over the indexes.// ... The "i" identifier is a standard index variable name.
for (var i in numbers) {
console.log("INDEX: " + i);
console.log("ELEMENT: " + numbers[i]);
}INDEX: 0
ELEMENT: 10
INDEX: 1
ELEMENT: 20
INDEX: 2
ELEMENT: 30
Array iteration, warning. Hoisting variables and caching the length in a for-loop may lead to micro-benchmark improvements. But these can disappear on more complex, real programs.
Array iteration, continued. In complex benchmarks I have found that the "for" loop with no cached lengths tends to perform the best. More complex loops are harder to optimize.
A looping review. Most programs are built around looping. Loops construct web pages, they animate graphics, they decide an optimal chess move.
Dot Net Perls is a collection of tested code examples. Pages are continually updated to stay current, with code correctness a top priority.
Sam Allen is passionate about computer languages. In the past, his work has been recommended by Apple and Microsoft and he has studied computers at a selective university in the United States.
