JavaScript Array Methods: The Complete Cheatsheet

Every array method you need, with practical examples you can copy and use today.

Transform

map() — Transform every element

const prices = [10, 20, 30];
const withTax = prices.map(p => p * 1.1);
// [11, 22, 33]

const users = [{name: 'Alice'}, {name: 'Bob'}];
const names = users.map(u => u.name);
// ['Alice', 'Bob']

filter() — Keep matching elements

const numbers = [1, 2, 3, 4, 5, 6];
const evens = numbers.filter(n => n % 2 === 0);
// [2, 4, 6]

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

reduce() — Accumulate to single value

const cart = [{price: 10}, {price: 20}, {price: 30}];
const total = cart.reduce((sum, item) => sum + item.price, 0);
// 60

// Group by category
const grouped = items.reduce((acc, item) => {
  (acc[item.category] ??= []).push(item);
  return acc;
}, {});

flatMap() — Map then flatten

const sentences = ["hello world", "foo bar"];
const words = sentences.flatMap(s => s.split(" "));
// ["hello", "world", "foo", "bar"]

Search

find() — First matching element

const user = users.find(u => u.id === 42);
// {id: 42, name: 'Alice'} or undefined

findIndex() — Index of first match

const idx = users.findIndex(u => u.name === 'Bob');
// 1 or -1 if not found

includes() — Contains value?

[1, 2, 3].includes(2);  // true
['a', 'b'].includes('c');  // false

some() — Any match?

const hasAdmin = users.some(u => u.role === 'admin');
// true if at least one admin

every() — All match?

const allVerified = users.every(u => u.verified);
// true only if ALL are verified

Sort & Reorder

sort() — Sort in place

// Numbers (ascending)
[3, 1, 2].sort((a, b) => a - b);  // [1, 2, 3]

// Strings
['banana', 'apple'].sort();  // ['apple', 'banana']

// Objects by property
users.sort((a, b) => a.name.localeCompare(b.name));

toSorted() — Sort without mutating (ES2023)

const sorted = numbers.toSorted((a, b) => a - b);
// Original array unchanged!

toReversed() — Reverse without mutating

const reversed = [1, 2, 3].toReversed();
// [3, 2, 1] — original unchanged

Create & Combine

Array.from() — Create from iterable

// Range of numbers
Array.from({length: 5}, (_, i) => i);
// [0, 1, 2, 3, 4]

// Unique values
[...new Set([1, 1, 2, 3, 3])];
// [1, 2, 3]

// NodeList to Array
Array.from(document.querySelectorAll('div'));

concat() / spread — Combine arrays

const combined = [...arr1, ...arr2];
// or
const combined = arr1.concat(arr2);

flat() — Flatten nested arrays

[1, [2, [3]]].flat();     // [1, 2, [3]]
[1, [2, [3]]].flat(Infinity);  // [1, 2, 3]

Extract & Modify

slice() — Extract portion (immutable)

const arr = [1, 2, 3, 4, 5];
arr.slice(1, 3);   // [2, 3]
arr.slice(-2);     // [4, 5]
arr.slice();       // shallow copy

splice() — Remove/insert (mutates!)

const arr = [1, 2, 3, 4, 5];
arr.splice(1, 2);        // removes [2, 3], arr = [1, 4, 5]
arr.splice(1, 0, 'a');   // inserts 'a' at index 1

with() — Replace at index (ES2023, immutable)

const arr = [1, 2, 3];
const updated = arr.with(1, 99);
// [1, 99, 3] — original unchanged

Iterate

forEach() — Side effects only

users.forEach(user => console.log(user.name));
// Returns undefined — use map() if you need a result

entries(), keys(), values()

for (const [index, value] of arr.entries()) {
  console.log(index, value);
}

Quick Reference Table

MethodReturnsMutates?
map()New arrayNo
filter()New arrayNo
reduce()Single valueNo
find()Element or undefinedNo
sort()Same arrayYes
toSorted()New arrayNo
splice()Removed itemsYes
slice()New arrayNo
forEach()undefinedNo
flat()New arrayNo

Try it live: Use our free JSON Formatter and Regex Tester tools.