Array Iteration Methods in JavaScript (Explained with Examples)

in this post, we’ll go step by step through the most important array iteration methods in JavaScript, with examples.

---

What Are Array Iteration Methods?

Array iteration methods are built-in functions available on JavaScript arrays that allow you to process elements without writing manual loops.

Instead of this:

for (let i = 0; i < arr.length; i++) {
  // logic
}

You can write this:

arr.map(...)
arr.filter(...)
arr.reduce(...)

This approach is more declarative and easier to understand.

---

forEach()

forEach() executes a callback function once for each element in an array.
It does not return a new array and is mainly used for side effects.

** Example: Sending Notifications**

const users = ["John", "Sarah", "Mike"];

users.forEach((user, index) => {
  console.log(`Sending notification to ${user} (User #${index})`);
});

Here,

-- JavaScript takes the first element "John"
-- Executes the callback function
-- Logs the message
-- Moves to "Sarah"
-- Moves to "Mike"
-- Stops after the last element

Output

Sending notification to John (User #0)
Sending notification to Sarah (User #1)
Sending notification to Mike (User #2)

Important: forEach() always returns undefined.

---

map()

map() creates a new array by applying a transformation function to every element in the original array.

It does not modify the original array.

Example: Adding 18% Tax

const prices = [100, 200, 300];

const pricesWithTax = prices.map((price) => {
  return price + price * 0.18;
});

console.log(pricesWithTax);

Here,

-- Takes 100 → returns 118
-- Takes 200 → returns 236
-- Takes 300 → returns 354
-- Creates a new array with these values

Output

[118, 236, 354]

Use map() whenever you need to transform data.

---

filter()

filter() creates a new array containing only the elements that satisfy a specified condition.

Example: Filtering Active Users

const users = [
  { name: "John", active: true },
  { name: "Sarah", active: false },
  { name: "Mike", active: true }
];

const activeUsers = users.filter(user => user.active);

console.log(activeUsers);

Here,

-- Checks John → active is true → included
-- ChecksSarah → active is false → excluded
-- Checks Mike → active is true→ included
-- Returns new array

Output

[
  { name: "John", active: true },
  { name: "Mike", active: true }
]

Use filter() when selecting specific data from a dataset.

---

reduce()

reduce()executes a reducer function on each element and returns a single accumulated value.

It is commonly used for totals, counts, grouping, or transforming arrays into objects.

Example: Calculating Cart Total

const cart = [100, 200, 300];

const total = cart.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
}, 0);

console.log(total);

Here,

-- Initial accumulator is 0
-- 0 + 100 = 100
-- 100 + 200 = 300
-- 300 + 300 = 600
-- Returns final value

Output

600

reduce() is extremely powerful once you understand accumulator logic.

---

find()

find() returns the first element in the array that satisfies a condition.

If no element matches, it returns undefined.

Example: Find Product by ID

const products = [
  { id: 1, name: "Laptop" },
  { id: 2, name: "Mobile" },
  { id: 3, name: "Tablet" }
];

const product = products.find(p => p.id === 2);

console.log(product);

Here,

-- Checks id 1 → not match
-- Checks id 2 → match found
-- Stops immediately
-- Returns the matched object

Output

{ id: 2, name: "Mobile" }

---

some()

some() checks whether at least one element satisfies a condition.
It returns a boolean value.

Example: Checking for Admin User

const users = [
  { name: "John", role: "user" },
  { name: "Sarah", role: "admin" }
];

const hasAdmin = users.some(user => user.role === "admin");

console.log(hasAdmin);

Output

true

It stops immediately after finding the first matching element.

---

every()

every()checks whether all elements satisfy a given condition.

It returns true only if every element passes the test.

Example: Checking If All Students Passed

const marks = [60, 70, 80, 90];

const allPassed = marks.every(mark => mark >= 35);

console.log(allPassed);

Output

true

If even one value fails the condition, it returns false.

---

Quick Comparison

-- forEach → Used for side effects, returns nothing
-- map→ Transforms data, returns a new array
--filter → Selects data, returns a new array
-- reduce → Aggregates data, returns a single value
-- find→ Returns first matching element
-- some → Returns true if at least one matches
-- every → Returns true only if all match