25 of 32 lessons

Video Lesson

Lesson Notes

Looping Over Array Elements with `for...of` in JavaScript

You can use the for...of loop for a concise way to iterate over every element in an array without managing an index.

Syntax

const names = ["John", "Mary", "Susie", "Jay", "Edward", "Mike"];

for (let value of names) {
  console.log(`Here is the name: ${value}`);
}

for (let value of names)
- value takes on each element in the names array in turn
- No need to initialize, check length, or increment an index

How It Works

The loop starts by assigning the first element ("John") to value.
Executes the loop body (console.log).
Moves to the next element ("Mary"), repeats until the end of the array.
Stops automatically when all elements have been processed.

Why Use `for...of`?

Less code: Eliminates index boilerplate.
Readability: Clearly expresses “do this for each element.”
Safety: Cannot accidentally go out of bounds or skip elements.

AI Assistant

Sign In Required

Array Iteration with JavaScript For Loops

Basic Objects in JavaScript (Simple)

Array Iteration: Using `for...of` in JavaScript

In this lesson, you'll discover the simplicity of the `for...of` loop in JavaScript, learning how to efficiently iterate through array elements without the hassle of managing indexes. By the end, you'll appreciate how this concise syntax enhances code readability and safety, making your programming experience smoother and more intuitive.

2m 5s