How To Iterate Array In Javascript

Arrays are an essential part of every programming language, and JavaScript is no exception. They allow us to store multiple values in a single variable and provide us with various methods to manipulate and iterate over those values. In this blog post, we’ll explore some of the most common ways to iterate arrays in JavaScript.

1. Using the for loop

The most basic way to iterate an array is using the for loop. You can access each element in the array using its index, which starts from 0 and goes up to the length of the array minus one.

        
const fruits = ['Apple', 'Banana', 'Cherry'];

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

2. Using the forEach method

The forEach method is a built-in array function that allows you to iterate through the array elements without using any indexes or counters. Instead, you provide a callback function that will be executed for each element in the array.

        
const fruits = ['Apple', 'Banana', 'Cherry'];

fruits.forEach(function (fruit) {
  console.log(fruit);
});
        
    

3. Using the for...of loop

The for...of loop is a modern and more concise way to iterate arrays (and other iterable objects) in JavaScript. This makes the code easier to read and understand.

        
const fruits = ['Apple', 'Banana', 'Cherry'];

for (const fruit of fruits) {
  console.log(fruit);
}
        
    

4. Using the map method

The map method allows you to iterate over an array and transform each element into a new array. This can be very useful when you need to create a new array based on the contents of an existing array.

        
const fruits = ['Apple', 'Banana', 'Cherry'];

const fruitsInUpperCase = fruits.map(function (fruit) {
  return fruit.toUpperCase();
});

console.log(fruitsInUpperCase); // ["APPLE", "BANANA", "CHERRY"]
        
    

5. Using the filter method

The filter method is another useful array method that allows you to iterate over an array and create a new array containing only the elements that meet a specific condition.

        
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const evenNumbers = numbers.filter(function (number) {
  return number % 2 === 0;
});

console.log(evenNumbers); // [2, 4, 6, 8, 10]
        
    

In conclusion, there are various ways to iterate over arrays in JavaScript, and the method you choose depends on your specific use case and personal preferences. We hope this blog post has been helpful in demonstrating some of the most common ways to work with arrays in JavaScript.