JavaScript for Loop Examples

Loop over a range of numbers, or elements in an array, with for-loops and while-loops.

For. A million numbers. A billion numbers. We want to loop over them all in order—with a for-loop, we have an efficient and standard looping construct.

With while, another loop, we can do the same thing as for, but the syntax may be simpler when an end point 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.

JavaScript program that uses for-loop // Loop over first 5 numbers and print them. for (var i = 0; i < 5; i++) { console.log("FOR-LOOP ITERATION: " + i); } Output 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.

JavaScript program that uses while-loop // Use while-loop over first five numbers. var i = 0; while (i < 5) { console.log("WHILE INDEX: " + i); i++; } Output 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.

JavaScript program that uses for-of loop var numbers = [10, 20, 30]; // Loop over the numbers in the array. for (var number of numbers) { console.log("FOR OF: " + number); } Output 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.

JavaScript program that uses for-in loop 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]); } Output 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

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.

The Dev Codes

.Net

.NET Array Dictionary List String 2D Async DataTable Dates DateTime Enum File For Foreach Format IEnumerable If IndexOf Lambda LINQ Parse Path Process Property Regex Replace Sort Split Static StringBuilder Substring Switch Tuple

Java

Core Array ArrayList HashMap String 2D Cast Character Console Deque Duplicates File For Format HashSet If IndexOf Lambda Math ParseInt Process Random Regex Replace Sort Split StringBuilder Substring Switch Vector While

TheDeveloperBlog.com

JavaScript for Loop Examples

Related Links:

.Net

Java

Related Links