Learn JavaScript: Loops

In this course, you will learn how to use for and while loops to execute blocks of code multiple times.

Start[missing "en.views.course_landing_page.introduction-to-javascript.course_illustration" translation]

Key Concepts

Review core concepts you need to learn to master this subject

.length property

// The syntax for looping through an array in JavaScript should look like this: for (let i = 0; i < array.length; i++){ console.log(array[i]); } // Output: every item in the array

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.

While loop

// The syntax for looping through an array in JavaScript should look like this: for (let i = 0; i < array.length; i++){ console.log(array[i]); } // Output: every item in the array

The while loop creates a loop that is executed as long as a specified condition remains true. The loop will continue to run until the condition evaluates to false. The condition is specified before the loop, and the loop is incremented within the body of the loop.

do...while statement

// The syntax for looping through an array in JavaScript should look like this: for (let i = 0; i < array.length; i++){ console.log(array[i]); } // Output: every item in the array

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 Break Keyword

// The syntax for looping through an array in JavaScript should look like this: for (let i = 0; i < array.length; i++){ console.log(array[i]); } // Output: every item in the array

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

JavaScript For Loop

// The syntax for looping through an array in JavaScript should look like this: for (let i = 0; i < array.length; i++){ console.log(array[i]); } // Output: every item in the array

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 ;

  1. The initialization defines where to begin the loop by declaring (or referencing) the iterator variable
  2. The stopping condition determines when to stop looping (when the expression evaluates to false)
  3. The iteration statement updates the iterator each time the loop is completed
Loops
Lesson 1 of 1
  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. 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. 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 [...] loop....

  4. 4

    What if we want the [...] loop to log [...] , [...] , [...] , and then [...] ? With simple modifications to the expressions, we can make our loop run backward! To run a backward [...] loop...

  5. 5

    [...] loops are very handy for iterating over data structures. For example, we can use a [...] loop to perform the same operation on each element on an array. Arrays hold lists of data, like cu...

  6. 6

    When we have a loop running inside another loop, we call that a nested loop. One use for a nested [...] loop is to compare the elements in two arrays. For each round of the outer [...] loop, ...

  7. 7

    You’re doing great! We're going to teach you about a different type of loop: the [...] loop. To start, let's convert a [...] loop into a [...] loop: [...] Let's break down what's happening ...

  8. 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 [...] statement comes in. A [...] statement sa...

  9. 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. 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

Pro Logo

How you'll master it

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

Pro Logo

Learn JavaScript: Loops

Start[missing "en.views.course_landing_page.introduction-to-javascript.course_illustration" translation]