Hackforge Academy

Explanation

map() and filter() in JavaScript (with Examples) Both map() and filter() are array methods used to process data easily. They are part of functional programming in JavaScript.

Code:

array.map((element, index) => {
   return newValue;
});

Explanation

Multiply Numbers

Code:

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

let doubled = numbers.map(num => num * 2);

console.log(doubled);

Explanation

Extract Names from Objects

Code:

let users = [
  { id: 1, name: "Praveen" },
  { id: 2, name: "Arun" }
];

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

console.log(names);

Explanation

filter() Method Purpose: Used to filter elements based on condition 1.Returns a new array 2.Keeps elements that return true

Code:

array.filter((element) => {
   return condition;
});

Explanation

Get Even Numbers

Code:

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

let even = numbers.filter(num => num % 2 === 0);

console.log(even);

Explanation

Combine map() and filter()

Code:

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

let result = numbers
  .filter(num => num % 2 === 0)
  .map(num => num * 10);

console.log(result);

Explanation

Real-Time Use Case

Code:

const products = [
  { id: 1, name: "Mobile", price: 10000 },

  { id: 2, name: "Laptop", price: 50000 }
];

// Filter expensive products
const expensive = products.filter(
p => p.price > 20000);

// Render names
const productNames = products.map(
p => <li>{p.name}</li>);