const fruits = ['apple', 'banana', 'cherry'];
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
There's nothing quite like the thrill of looping through an array in JavaScript, am I right? But seriously, it's a fundamental concept that we use all the time. And yet, I still find myself Googling "javascript loop through array" every now and then to make sure I'm doing it right.
The Classic For Loop
So let's start with the basics. The for loop is probably the most common way to loop through an array in JavaScript. And for good reason - it's simple and easy to understand.
const numbers = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
console.log(numbers[i]);
}
But let's be real, who likes writing all that extra code? I honestly prefer using the forEach method whenever possible.
The forEach Method
Call me old-fashioned, but there's something about the forEach method that just feels more... elegant. Maybe it's the fact that you don't have to keep track of an index variable.
const colors = ['red', 'green', 'blue'];
colors.forEach(color => {
console.log(color);
});
And did you know that you can also use forEach on other types of data structures, like sets and maps? Yeah, it's pretty cool.
The For...of Loop
But wait, there's more! The for...of loop is another way to loop through an array in JavaScript. And it's actually pretty similar to the forEach method.
const animals = ['dog', 'cat', 'bird'];
for (const animal of animals) {
console.log(animal);
}
So why would you use one over the other? Well, it really comes down to personal preference. But if you're working with a team, it's probably best to stick with one or the other to avoid confusion.
The While Loop
And finally, we have the while loop. Now, this one can be a bit tricky - especially if you're new to programming.
const names = ['John', 'Jane', 'Bob'];
let i = 0;
while (i < names.length) {
console.log(names[i]);
i++;
}
If you've debugged this at 2am and still can't figure out why your while loop isn't working - don't worry, we've all been there. Just take a deep breath and remember that it's all about the condition statement.
Nested Loops
And what about nested loops? You know, when you need to loop through multiple arrays at once. It can get pretty complicated pretty fast.
const arr1 = [1, 2, 3];
const arr2 = ['a', 'b', 'c'];
for (let i = 0; i < arr1.length; i++) {
for (let j = 0; j < arr2.length; j++) {
console.log(`${arr1[i]} ${arr2[j]}`);
}
}
So how do you avoid getting lost in all those loops? Well, here are a few tips:
- Use clear variable names. It may seem obvious, but trust me - it makes a big difference.
- Keep your loops organized. Use indentation and whitespace to make your code easier to read.
- Test your code thoroughly. Don't just assume that your loops are working correctly - actually test them out with some sample data.

Conclusion
And there you have it - a rundown of some of the most common ways to loop through an array in JavaScript. Whether you're a seasoned pro or just starting out - hopefully this article has been helpful in some way.
Ready to take your coding skills to the next level? Check out CodeConverter.co - our AI-powered code language converter can help you convert your code from one language to another with ease. Say goodbye to tedious manual conversions and hello to more productivity!