Post

πŸ“š JavaScript Array Methods Cheat Sheet

πŸ“š JavaScript Array Methods Cheat Sheet

A complete guide to 41 built-in array methods in JavaScript β€” grouped, explained, and summarized by purpose, return type, and argument structure.

Learning JavaScript arrays can be tricky at first because there are so many methods, each with subtle differences. Here’s a cheat sheet that helped me untangle them, with easy explanations so you can find what you need quickly.


1. Mutator Methods (Modify Original Array)

These methods change the original array directly. When you want to add, remove, or reorder elements and keep those changes, use these.

Be careful: they affect the array in place, which can sometimes cause bugs if you’re not expecting it.

MethodArgumentsDescriptionReturns
push()...itemsAdd to endNew length
pop()noneRemove lastRemoved item
shift()noneRemove firstRemoved item
unshift()...itemsAdd to startNew length
splice()start, deleteCount, …itemsAdd/remove at indexRemoved items
sort()compareFn(a, b)Sort elementsSorted array
reverse()noneReverse arrayReversed array
fill()value, start, endFill with valueModified array
copyWithin()target, start, endCopy sectionModified array

2. Non-Mutating Methods (Return New Arrays)

If you want to keep your original array unchanged, these methods return a new array with your desired changes or selections. This is great for safer, more predictable code.

MethodArgumentsDescriptionReturns
toSorted()compareFn(a, b)Sorted copyNew array
toReversed()noneReversed copyNew array
toSpliced()start, deleteCount, …itemsSplice copyNew array
slice()start, endPortion of arrayNew array
concat()...arrays/itemsMerge arraysNew array
map()callback(element, index, ?, array?), thisArgTransform itemsNew array
filter()callback(element, index, ?, array?), thisArgFilter itemsNew array
flat()depthFlatten nested arraysNew array
flatMap()callback(element, index, ?, array?), thisArgMap + flattenNew array
from()arrayLike, mapFn(element, index), thisArgFrom iterableNew array
of()...itemsFrom argumentsNew array

3. Iteration / Evaluation Methods

These methods loop through the array, performing actions or checks. Some return new arrays, some return values, and some don’t return anything. They’re essential for processing arrays efficiently.

MethodArgumentsDescriptionReturns
forEach()callback(element, index, ?, array?), thisArgLoop over itemsundefined
map()callback(element, index, ?, array?), thisArgTransformNew array
filter()callback(element, index, ?, array?), thisArgFilterNew array
reduce()callback(acc, cur, index, ?, array?), initialValueLeft-to-right reduceSingle value
reduceRight()Same as reduce()Right-to-left reduceSingle value
some()callback(element, index, ?, array?), thisArgIf any matchBoolean
every()callback(element, index, ?, array?), thisArgIf all matchBoolean

4. Search & Index Methods

Use these when you need to find elements or check their existence. They return indexes, booleans, or the element found, making it easy to locate data in arrays.

MethodArgumentsDescriptionReturns
indexOf()searchElement, fromIndexFirst match indexIndex or -1
lastIndexOf()searchElement, fromIndexLast match indexIndex or -1
includes()searchElement, fromIndexCheck presenceBoolean
find()callback(element, index, ?, array?), thisArgFirst match elementValue or undefined
findIndex()callback(element, index, ?, array?), thisArgIndex of first matchIndex or -1
findLast()callback(element, index, ?, array?), thisArgLast match elementValue or undefined
findLastIndex()callback(element, index, ?, array?), thisArgIndex of last matchIndex or -1

5. Element Access & Iterators

These methods help you access specific elements or iterate over keys and values without changing the array. Useful for controlled traversal or when working with array-like structures.

MethodArgumentsDescriptionReturns
at()indexGet item at index (can be negative)Element or undefined
keys()noneIterator of indexesIterator
values()noneIterator of valuesIterator
entries()noneIterator of [index, value] pairsIterator

6. Structure & Conversion Utilities

These are handy utility methods to check, convert, or extend arrays. They don’t change the array but help you understand or transform it into other forms.

MethodArgumentsDescriptionReturns
isArray()valueCheck if value is arrayBoolean
toString()noneConvert to comma-separated stringString
join()separatorJoin into custom stringString
valueOf()nonePrimitive valueThe array itself
prototype(object)Extend array behaviorObject

Categorized by Return Type

Understanding what each method returns helps you predict how to chain them and avoid unexpected bugs.

  • New Array: methods that return a new array rather than modifying the original.
    Examples: map, filter, slice, concat, flat, flatMap, toSorted, toReversed, toSpliced, from, of

  • Boolean: methods that return true or false based on conditions.
    Examples: some, every, includes, isArray

  • Index: methods that return the position of elements or -1 if not found.
    Examples: indexOf, lastIndexOf, findIndex, findLastIndex

  • Single Value: methods that return a single value calculated from the array, like a sum or found element.
    Examples: reduce, reduceRight, find, findLast, at, join, toString, valueOf

  • Iterator: methods that return an iterable to traverse keys or values.
    Examples: keys, values, entries

  • Undefined: methods that return undefined and are used for side effects.
    Example: forEach


Categorized by Number of Arguments

Different methods expect different numbers of arguments. Some take none, some take one, and others take multiple.

Knowing this helps you use them correctly without errors.

  • 0 arguments: pop, shift, reverse, toReversed, keys, values, entries, toString, valueOf

  • 1 argument: push(item), includes(value), flat(depth), at(index), isArray(value), join(separator), find(callback), map(callback), filter(callback), forEach(callback), every(callback), some(callback)

  • 2 arguments: indexOf(value, fromIndex), lastIndexOf(value, fromIndex), fill(value, start), slice(start, end), copyWithin(target, start), reduce(callback, initialValue), reduceRight(callback, initialValue)

  • 3+ arguments: splice(start, deleteCount, ...items), copyWithin(target, start, end), from(arrayLike, mapFn, thisArg), flatMap(callback, thisArg)


Ultimate JS Array Method CheatSheet (Categorized by Similar Purpose)

Grouping methods by what they do helps pick the right one when coding:

CategoryMethods
πŸ› οΈ Add / Remove Itemspush()β˜…β˜…β˜…, pop()β˜…β˜…β˜…, shift()β˜…β˜…β˜…, unshift()β˜…β˜…β˜…, splice()β˜…β˜…β˜…, toSpliced()β˜…β˜…
πŸ“₯ Copy / Extractslice()β˜…β˜…β˜…, concat()β˜…β˜…β˜…, fill()β˜…, copyWithin()β˜…, with()β˜…
πŸ”„ Transform Elementsmap()β˜…β˜…β˜…, flatMap()β˜…β˜…β˜…
βœ… Filter by Conditionfilter()β˜…β˜…β˜…
🧠 Accumulate to One Valuereduce()β˜…β˜…β˜…, reduceRight()β˜…β˜…
πŸ” Iterate (Side Effects Only)forEach()β˜…β˜…β˜…
πŸ”ƒ Reorder / Sortsort()β˜…β˜…β˜…, reverse()β˜…β˜…β˜…, toSorted()β˜…β˜…, toReversed()β˜…β˜…
🧱 Flatten Arraysflat()β˜…β˜…β˜…, flatMap()β˜…β˜…β˜…
πŸ” Search by ValueindexOf()β˜…β˜…β˜…, lastIndexOf()β˜…β˜…, includes()β˜…β˜…β˜…
πŸ”Ž Search by Conditionfind()β˜…β˜…β˜…, findIndex()β˜…β˜…β˜…, findLast()β˜…β˜…, findLastIndex()β˜…β˜…
βœ… Test Conditions (Boolean)some()β˜…β˜…β˜…, every()β˜…β˜…β˜…
πŸ“ Access by Indexat()β˜…β˜…
πŸ”‘ Keys / Values / Entrieskeys()β˜…, values()β˜…, entries()β˜…
🧾 Convert to Stringjoin()β˜…β˜…, toString()β˜…
πŸ—οΈ Create Arrays (Static)Array.from()β˜…β˜…, Array.of()β˜…, Array.isArray()β˜…β˜…
πŸ“‰ Others(no methods with 0-star priority here)

Further Reading & Deep Dive

Explore these trusted resources to master JavaScript array methods, from documentation to hands-on practice.

This post is licensed under CC BY 4.0 by the author.