Cheat Sheets

JavaScript Array Methods Cheat Sheet: Map, Filter, Reduce & More

By ArpaNeuro Team September 12, 2026
JavaScript arrays cheat sheet

JavaScript array methods iterate and transform lists without a manual index. map, filter, and reduce are the core; find, some, every, and flatMap cover lookup and nested data. Prefer non-mutating methods, or copy first before sort and reverse.

This JavaScript cheat sheet is written for people searching for a fast, accurate reference: students, junior developers, and teams shipping production software. Pin it, copy the snippets, and come back when syntax slips.

Quick reference

  • map: New array of the same length: items.map((x) => x.id).
  • filter: Keep items that return true. Does not mutate the source.
  • reduce: Fold to one value: sum, group, or build a map. Always pass an initial value.
  • find / findIndex: First match or undefined / -1. Use filter when you need many.
  • some / every: some is OR, every is AND. Both short-circuit.
  • slice: slice(start, end) copies. splice mutates — avoid in UI state.
  • sort: Mutates. Use [...list].sort((a, b) => a.n - b.n) for numbers.
  • includes: Value equality with ===. Objects need find by id, not includes.

Copy-paste examples

Filter, map, and reduce a cart

Chain from left to right. reduce needs 0 as the starting sum or the first item becomes the accumulator.

const cart = [
  { sku: 'A', price: 20, qty: 2 },
  { sku: 'B', price: 5, qty: 0 },
  { sku: 'C', price: 12, qty: 1 },
];
const total = cart
  .filter((line) => line.qty > 0)
  .map((line) => line.price * line.qty)
  .reduce((sum, n) => sum + n, 0);
console.log(total); // 52

Group by key without mutating

A Map or object accumulator is a common reduce pattern for dashboards.

function groupBy(list, key) {
  return list.reduce((acc, item) => {
    const k = item[key];
    (acc[k] ??= []).push(item);
    return acc;
  }, {});
}

Common mistakes

  • Using map when you meant forEach and ignoring the returned array.
  • Sorting in place (list.sort()) and breaking React state or cached props.
  • reduce without an initial value on an empty array — it throws.
  • Comparing objects with includes ([{id:1}].includes({id:1}) is false).

FAQ

  1. for-loop or array methods? Methods are clearer for transforms. Use a for loop when you need break, performance on huge lists, or to build two outputs at once.
  1. Does BLOGPH0 skip holes? map visits empty slots as undefined in sparse arrays. Prefer dense arrays from filter/push.
  1. How do I unique an array of primitives? [...new Set(list)]. For objects, unique by id with a Map.

Related JavaScript cheat sheets

Build with this stack

When a cheat sheet is not enough — you need a production app, a student FYP, or a custom dashboard — ArpaNeuro builds custom web development and also sells ready-made source code. Request a quote and tell us the stack.

Browse software development services or the source code marketplace if you want a working codebase instead of starting from a blank file.

← All Articles Get a Quote →