How to Loop Through an Array in JavaScript

for...of — the modern default

const items = ["a", "b", "c"];
for (const item of items) {
  console.log(item);
}

forEach — when you want a callback

items.forEach((item, index) => {
  console.log(index, item);
});

map — when you want a new array back

const upper = items.map((item) => item.toUpperCase());
// ["A", "B", "C"]

The classic for loop — full control

for (let i = 0; i < items.length; i++) {
  console.log(items[i]);
}

Which loop should you use?

• for...of — the everyday choice for reading values.
• map — when you want a transformed copy of the array.
• forEach — for side effects when you do not need to stop early.
• classic for — when you need the index or unusual stepping.

Frequently asked questions

Can I use break inside forEach?

No. forEach cannot be stopped early. If you need break, use a for...of or classic for loop.

What about for...in?

Avoid for...in for arrays — it loops over keys and can pick up extra properties. Use for...of for array values.

Getting started with JavaScript? Our free JavaScript course walks through arrays and loops with live examples.