Learn JavaScript: Loops

Key Concepts

Review core concepts you need to learn to master this subject

While Loops in JavaScript

JavaScript Reverse Loop

do…while statement

JavaScript For Loop

.length property

JavaScript Break Keyword

JavaScript Nested For Loop

Loops

While Loops in JavaScript

while (condition) {
  code block to be executed
}

// OR

// i = 0 is the initialization
let i = 0;
// i < 5 is the condition
while (i < 5) {        
  console.log(i);
  // i++ is the incrementation
  i++;
}

The JavaScript while loop creates a loop that is executed as long as a specified condition evaluates to true. The loop will continue to run until the condition evaluates to false. The condition is specified before the loop, and usually some variable is incremented or altered in the while loop body to determine when the loop should stop.

JavaScript Reverse Loop

while (condition) {
  code block to be executed
}

// OR

// i = 0 is the initialization
let i = 0;
// i < 5 is the condition
while (i < 5) {        
  console.log(i);
  // i++ is the incrementation
  i++;
}

A JavaScript for loop can iterate “in reverse” by initializing the loop variable to the starting value, testing for when the variable hits the ending value, and decrementing (subtracting from) the loop variable at each iteration.

do…while statement

while (condition) {
  code block to be executed
}

// OR

// i = 0 is the initialization
let i = 0;
// i < 5 is the condition
while (i < 5) {        
  console.log(i);
  // i++ is the incrementation
  i++;
}

A do...while statement creates a loop that executes a block of code once, checks if a condition is true, and then repeats the loop as long as the condition is true. They are used when you want the code to always execute at least once. The loop ends when the condition evaluates to false.

JavaScript For Loop

while (condition) {
  code block to be executed
}

// OR

// i = 0 is the initialization
let i = 0;
// i < 5 is the condition
while (i < 5) {        
  console.log(i);
  // i++ is the incrementation
  i++;
}

Loops execute a block of code multiple times. In JavaScript, a for loop declares looping instructions, with three important pieces of information separated by semicolons ;

The initialization defines where to begin the loop by declaring (or referencing) the iterator variable
The stopping condition determines when to stop looping (when the expression evaluates to false)
The iteration statement updates the iterator each time the loop is completed

.length property

while (condition) {
  code block to be executed
}

// OR

// i = 0 is the initialization
let i = 0;
// i < 5 is the condition
while (i < 5) {        
  console.log(i);
  // i++ is the incrementation
  i++;
}

A JavaScript array’s length can be evaluated with the .length property. array.length will return the exact length of the array in question. This is extremely helpful for looping through arrays, as the .length of the array can be used as the stopping condition in the loop.

JavaScript Break Keyword

while (condition) {
  code block to be executed
}

// OR

// i = 0 is the initialization
let i = 0;
// i < 5 is the condition
while (i < 5) {        
  console.log(i);
  // i++ is the incrementation
  i++;
}

Within a loop in JavaScript, the break keyword may be used to exit the loop immediately, continuing execution after the loop body.

JavaScript Nested For Loop

while (condition) {
  code block to be executed
}

// OR

// i = 0 is the initialization
let i = 0;
// i < 5 is the condition
while (i < 5) {        
  console.log(i);
  // i++ is the incrementation
  i++;
}

In JavaScript, a nested for loop is when a for loop runs inside another for loop.

The inner loop will run all its iterations for each iteration of the outer loop.

Loops

while (condition) {
  code block to be executed
}

// OR

// i = 0 is the initialization
let i = 0;
// i < 5 is the condition
while (i < 5) {        
  console.log(i);
  // i++ is the incrementation
  i++;
}

A loop is a programming tool that is used to repeat a set of instructions. Iterate is a generic term that means “to repeat” in the context of loops. A loop will continue to iterate until a specified condition, commonly known as a stopping condition, is met.

Stopping for(…) loops

while (condition) {
  code block to be executed
}

// OR

// i = 0 is the initialization
let i = 0;
// i < 5 is the condition
while (i < 5) {        
  console.log(i);
  // i++ is the incrementation
  i++;
}

The second expression in a JavaScript for loop is known as the stopping condition. It is used to determine whether to execute the statements in the code block or whether to exit the loop.

If the expression evaluates to true, the statements in the code block are executed. If the expression evaluates to false, the stopping condition has been met and the loop is exited.

Loops

Lesson 1 of 1

1
A loop is a programming tool that repeats a set of instructions until a specified condition, called a stopping condition is reached. As a programmer, you’ll find that you rely on loops all the …
2
Before we write our own loops let’s take a moment to develop an appreciation for loops. The best way to do that is by showing you how cumbersome it would be if a repeated task required you to type …
3
Instead of writing out the same code over and over, loops allow us to tell computers to repeat a given block of code on its own. One way to give computers these instructions is with a for loop. T…
4
What if we want the for loop to log 3, 2, 1, and then 0? With simple modifications to the expressions, we can make our loop run backward! To run a backward for loop, we must: * Set the iterator va…
5
for loops are very handy for iterating over data structures. For example, we can use a for loop to perform the same operation on each element on an array. Arrays hold lists of data, like customer n…
6
When we have a loop running inside another loop, we call that a nested loop. One use for a nested for loop is to compare the elements in two arrays. For each round of the outer for loop, the inne…
7
You’re doing great! We’re going to teach you about a different type of loop: the while loop. To start, let’s convert a for loop into a while loop: // A for loop that prints 1, 2, and 3 for (let cou…
8
In some cases, you want a piece of code to run at least once and then loop based on a specific condition after its initial run. This is where the do…while statement comes in. A do…while statem…
9
Imagine we’re looking to adopt a dog. We plan to go to the shelter every day for a year and then give up. But what if we meet our dream dog on day 65? We don’t want to keep going to the shelter for…
10
Great job! In this lesson, we learned how to write cleaner code with loops. You now know: - Loops perform repetitive actions so we don’t have to code that process manually every time. - How to wri…

What you'll create

Portfolio projects that showcase your new skills

Whale Talk
It's time to build fluency in JavaScript fundamentals. In this next Pro Project, we're going to practice loops in JavaScript so you can hone your skills and feel confident taking them to the real world. Why? Mastering the art of looping is a key part of becoming a JavaScript developer. What's next? Talking like a whale, vowel matching, more JavaScript. You got this!

How you'll master it

Stress-test your knowledge with quizzes that help commit syntax to memory

Loops Quiz
Which statement is true about while loops?

While Loops in JavaScript

JavaScript Reverse Loop

do…while statement

JavaScript For Loop

.length property

JavaScript Break Keyword

JavaScript Nested For Loop

Loops

Stopping for(…) loops

Whale Talk

Loops Quiz