«Back to Home

Learn JavaScript

Topics

Important Array Methods (map, filter, reduce, forEach, find, and more)

Arrays are foundational data structures in JavaScript, and modern JavaScript provides a wide range of built-in methods that simplify array manipulation. This chapter covers the most essential array methods used frequently in real-world projects, interviews, competitive programming, data processing, and web applications.

Key Methods Covered

  • forEach()

  • map()

  • filter()

  • reduce()

  • find()

  • findIndex()

  • some()

  • every()

  • sort()

  • includes()

1. forEach()

Used to loop through each item in an array. It does not return a new array.

Example:

let nums = [1, 2, 3, 4];

nums.forEach(n => {
    console.log(n);
});

Output:

1
2
3
4

2. map()

Creates and returns a new array by applying a function to each element.

Example: Multiply each number by 2

let nums = [1, 2, 3, 4];

let doubled = nums.map(n => n * 2);

console.log(doubled);

Output:

[2, 4, 6, 8]

3. filter()

Returns a new array containing elements that satisfy a specific condition.

Example: Keep only numbers greater than 2

let nums = [1, 2, 3, 4];

let result = nums.filter(n => n > 2);

console.log(result);

Output:

[3, 4]

4. find()

Returns the first element that matches a condition.

let users = [
    { id: 1, name: "Aman" },
    { id: 2, name: "Riya" }
];

let user = users.find(u => u.id === 2);

console.log(user);

Output:

{ id: 2, name: "Riya" }

5. findIndex()

Returns the index of the first matching element.

let nums = [10, 20, 30];

let index = nums.findIndex(n => n === 20);

console.log(index);

Output:

1

6. reduce()

Combines all elements into a single value (sum, product, max, etc.).

Example: Sum of numbers

let nums = [1, 2, 3, 4];

let total = nums.reduce((acc, n) => acc + n, 0);

console.log(total);

Output:

10

Example: Maximum number

let max = nums.reduce((acc, n) => acc > n ? acc : n);

console.log(max);

7. some()

Returns true if at least one element satisfies a condition.

let nums = [1, 2, 3, 4];

let hasEven = nums.some(n => n % 2 === 0);

console.log(hasEven);

Output:

true

8. every()

Returns true only if all elements satisfy the condition.

let nums = [2, 4, 6];

let allEven = nums.every(n => n % 2 === 0);

console.log(allEven);

Output:

true

9. sort()

Sorts an array. By default, sorting is done as strings.

Example: Sorting numbers correctly

let nums = [5, 3, 8, 1];

nums.sort((a, b) => a - b);

console.log(nums);

Output:

[1, 3, 5, 8]

10. includes()

Checks whether an array contains a specific value.

let names = ["Aman", "Riya", "John"];

console.log(names.includes("Riya"));

Output:

true

Real-Life Example 1: Filtering Users Above Age 18

let users = [
    { name: "Aman", age: 17 },
    { name: "Riya", age: 22 },
    { name: "Meera", age: 19 }
];

let adults = users.filter(u => u.age >= 18);

console.log(adults);

Real-Life Example 2: Mapping Usernames

let users = [
    { name: "Aman" },
    { name: "Riya" },
    { name: "Kunal" }
];

let names = users.map(u => u.name);

console.log(names);

Output:

["Aman", "Riya", "Kunal"]

Real-Life Example 3: Total Order Price

let cart = [
    { item: "Book", price: 200 },
    { item: "Pen", price: 20 },
    { item: "Bag", price: 500 }
];

let total = cart.reduce((acc, p) => acc + p.price, 0);

console.log("Total:", total);

Output:

Total: 720

Example Program (Complete)

let numbers = [1, 2, 3, 4, 5];

// double values
let doubled = numbers.map(n => n * 2);

// filter even numbers\let evens = numbers.filter(n => n % 2 === 0);

// sum of all numbers
let sum = numbers.reduce((acc, n) => acc + n, 0);

console.log(doubled);
console.log(evens);
console.log(sum);

Output:

[2, 4, 6, 8, 10]
[2, 4]
15

Common Mistakes Beginners Make

  • Using forEach when map is required

  • Forgetting that map returns a new array

  • Incorrect numeric sorting with sort()

  • Not providing an initial value in reduce()

  • Using filter instead of find for single matches