How do map, filter and reduce work?

These three methods cover most array transformations. The important distinction is the shape of the result: transform each item, select some items, or combine everything into one value.

const orders = [
  { id: 1, total: 120, paid: true },
  { id: 2, total: 80, paid: false },
  { id: 3, total: 200, paid: true },
];

const totals = orders.map((order) => order.total);
const paid = orders.filter((order) => order.paid);
const revenue = paid.reduce((sum, order) => sum + order.total, 0);

console.log(totals); // [120, 80, 200]
console.log(revenue); // 320

Choosing the right method

• map when every input produces exactly one output
• filter when you only need the items that satisfy a predicate
• reduce when the result is one value: a sum, a lookup table, a grouped object or a flattened array
• forEach when you only need side effects and do not need a returned array

reduce is the most flexible and the easiest to overuse. If a chain of map and filter is clearer, keep it. Reach for reduce when the accumulator genuinely represents the result.

const grouped = orders.reduce((groups, order) => {
  const key = order.paid ? "paid" : "unpaid";
  (groups[key] ??= []).push(order);
  return groups;
}, {});