📖 Guide
JS Array Methods
Complete JavaScript Array methods reference — creating, searching, transforming, sorting, iterating, and common patterns.
96 commands across 9 categories
Creating ArraysAdding & RemovingSearchingTransformingSortingIteratingCombiningStatic MethodsCommon Patterns
Creating Arrays
| Command | Description |
|---|---|
const arr = [1, 2, 3] | Array literal — most common way to create arrays |
const arr = new Array(5) | Create array with 5 empty slots (sparse array) |
const arr = new Array(1, 2, 3) | Create array with specific elements |
Array.of(1, 2, 3)e.g. // [1, 2, 3] | Create array from arguments (avoids new Array pitfall) |
Array.from("hello")e.g. // ["h", "e", "l", "l", "o"] | Create array from iterable |
Array.from({ length: 5 }, (_, i) => i)e.g. // [0, 1, 2, 3, 4] | Create array with mapping function |
Array.from(new Set([1, 2, 2, 3]))e.g. // [1, 2, 3] | Create array from Set (deduplicate) |
Array.isArray([1, 2])e.g. // true | Check if a value is an array |
Array.isArray("hello")e.g. // false | Not an array |
[..."hello"]e.g. // ["h", "e", "l", "l", "o"] | Spread string into array of characters |
Array(3).fill(0)e.g. // [0, 0, 0] | Create array filled with zeros |
Array.from({ length: 3 }, () => []) | Create array of unique empty arrays (not references to same array) |
Adding & Removing
| Command | Description |
|---|---|
arr.push(4, 5)e.g. [1,2,3].push(4) // length: 4 | Add elements to end, returns new length |
arr.pop()e.g. [1,2,3].pop() // 3 | Remove and return last element |
arr.unshift(0)e.g. [1,2,3].unshift(0) // length: 4 | Add elements to beginning, returns new length |
arr.shift()e.g. [1,2,3].shift() // 1 | Remove and return first element |
arr.splice(1, 2)e.g. [1,2,3,4].splice(1,2) // [2,3], arr is [1,4] | Remove 2 elements starting at index 1, returns removed |
arr.splice(1, 0, "a", "b")e.g. [1,2,3].splice(1,0,"a") // arr is [1,"a",2,3] | Insert elements at index 1 without removing |
arr.splice(1, 1, "x")e.g. [1,2,3].splice(1,1,"x") // arr is [1,"x",3] | Replace 1 element at index 1 |
arr.fill(0)e.g. [1,2,3].fill(0) // [0,0,0] | Fill all elements with a value |
arr.fill(0, 1, 3)e.g. [1,2,3,4].fill(0,1,3) // [1,0,0,4] | Fill from index 1 to 3 (exclusive) |
arr.copyWithin(0, 2)e.g. [1,2,3,4].copyWithin(0,2) // [3,4,3,4] | Copy elements within array |
arr.length = 0 | Clear array by setting length to 0 |
arr.with(1, "x")e.g. [1,2,3].with(1,"x") // [1,"x",3] | Return new array with element at index replaced (ES2023) |
Searching
| Command | Description |
|---|---|
arr.indexOf(2)e.g. [1,2,3,2].indexOf(2) // 1 | First index of value, or -1 if not found |
arr.lastIndexOf(2)e.g. [1,2,3,2].lastIndexOf(2) // 3 | Last index of value |
arr.includes(2)e.g. [1,2,3].includes(2) // true | Check if array contains value (boolean) |
arr.find(x => x > 2)e.g. [1,2,3,4].find(x => x > 2) // 3 | Find first element matching predicate |
arr.findIndex(x => x > 2)e.g. [1,2,3,4].findIndex(x => x > 2) // 2 | Find index of first matching element |
arr.findLast(x => x > 2)e.g. [1,2,3,4].findLast(x => x > 2) // 4 | Find last element matching predicate (ES2023) |
arr.findLastIndex(x => x > 2)e.g. [1,2,3,4].findLastIndex(x => x > 2) // 3 | Find index of last matching element (ES2023) |
arr.filter(x => x > 2)e.g. [1,2,3,4].filter(x => x > 2) // [3,4] | Return new array with all matching elements |
arr.some(x => x > 3)e.g. [1,2,3,4].some(x => x > 3) // true | Check if at least one element matches |
arr.every(x => x > 0)e.g. [1,2,3].every(x => x > 0) // true | Check if all elements match |
Transforming
| Command | Description |
|---|---|
arr.map(x => x * 2)e.g. [1,2,3].map(x => x * 2) // [2,4,6] | Create new array by transforming each element |
arr.map((val, idx) => `${idx}: ${val}`)e.g. ["a","b"].map((v,i) => `${i}: ${v}`) // ["0: a", "1: b"] | Map with index |
arr.reduce((acc, x) => acc + x, 0)e.g. [1,2,3].reduce((a,x) => a+x, 0) // 6 | Reduce to single value (sum) |
arr.reduce((acc, x) => ({ ...acc, [x.id]: x }), {}) | Reduce array to object (index by id) |
arr.reduceRight((acc, x) => acc + x, "") | Reduce from right to left |
arr.flat()e.g. [[1,2],[3,4]].flat() // [1,2,3,4] | Flatten one level of nesting |
arr.flat(Infinity)e.g. [1,[2,[3,[4]]]].flat(Infinity) // [1,2,3,4] | Flatten all levels of nesting |
arr.flatMap(x => [x, x * 2])e.g. [1,2].flatMap(x => [x, x*2]) // [1,2,2,4] | Map then flatten one level |
arr.flatMap(x => x.tags) | Flatten nested arrays from objects |
arr.slice(1, 3)e.g. [1,2,3,4].slice(1,3) // [2,3] | Extract portion (start inclusive, end exclusive) |
arr.slice(-2)e.g. [1,2,3,4].slice(-2) // [3,4] | Last 2 elements |
arr.slice() | Shallow copy of array |
Object.groupBy(arr, item => item.category)e.g. Object.groupBy([{c:"a"},{c:"b"},{c:"a"}], x=>x.c) | Group array elements by key (ES2024) |
Sorting
| Command | Description |
|---|---|
arr.sort()e.g. [10,9,1].sort() // [1, 10, 9] ⚠️ | Sort in place (converts to strings by default!) |
arr.sort((a, b) => a - b)e.g. [3,1,2].sort((a,b) => a-b) // [1,2,3] | Sort numbers ascending |
arr.sort((a, b) => b - a)e.g. [1,3,2].sort((a,b) => b-a) // [3,2,1] | Sort numbers descending |
arr.sort((a, b) => a.name.localeCompare(b.name)) | Sort strings with locale awareness |
arr.reverse()e.g. [1,2,3].reverse() // [3,2,1] | Reverse array in place |
arr.toSorted((a, b) => a - b)e.g. [3,1,2].toSorted((a,b) => a-b) // [1,2,3] | Return new sorted array without mutating (ES2023) |
arr.toReversed()e.g. [1,2,3].toReversed() // [3,2,1] | Return new reversed array without mutating (ES2023) |
arr.toSpliced(1, 1)e.g. [1,2,3].toSpliced(1,1) // [1,3] | Return new array with splice applied (ES2023) |
[...arr].sort((a, b) => a - b) | Sort copy (pre-ES2023 immutable pattern) |
Iterating
| Command | Description |
|---|---|
arr.forEach((val, idx) => console.log(idx, val)) | Execute function for each element (no return value) |
for (const item of arr) { ... } | for...of loop — iterate over values |
for (const [idx, val] of arr.entries()) { ... } | Iterate with index and value |
arr.entries() | Iterator of [index, value] pairs |
arr.keys()e.g. [...['a','b','c'].keys()] // [0, 1, 2] | Iterator of indices |
arr.values() | Iterator of values |
for (let i = 0; i < arr.length; i++) { arr[i] } | Classic for loop — when you need index control |
for (const key in arr) { ... } | for...in — iterates over indices as strings (avoid for arrays) |
arr.at(0)e.g. [1,2,3].at(0) // 1 | Get element at index (supports negative) |
arr.at(-1)e.g. [1,2,3].at(-1) // 3 | Get last element |
Combining
| Command | Description |
|---|---|
arr1.concat(arr2)e.g. [1,2].concat([3,4]) // [1,2,3,4] | Merge arrays (returns new array) |
arr1.concat(arr2, arr3) | Merge multiple arrays |
[...arr1, ...arr2]e.g. [...[1,2], ...[3,4]] // [1,2,3,4] | Spread operator — merge arrays |
[...arr1, newItem, ...arr2] | Insert item between arrays |
arr.join(", ")e.g. [1,2,3].join(", ") // "1, 2, 3" | Join elements with separator |
arr.join("")e.g. ["h","i"].join("") // "hi" | Join without separator |
arr.join("\n") | Join with newlines |
arr.toString()e.g. [1,2,3].toString() // "1,2,3" | Convert to comma-separated string |
Static Methods
| Command | Description |
|---|---|
Array.from(iterable) | Create array from any iterable (string, Set, Map, NodeList) |
Array.from(iterable, mapFn)e.g. Array.from([1,2,3], x => x * 2) // [2,4,6] | Create and map in one step |
Array.from({ length: n }, (_, i) => i)e.g. Array.from({length:5}, (_,i) => i) // [0,1,2,3,4] | Create range [0, n) |
Array.isArray(value) | Check if value is an array (most reliable method) |
Array.of(1, 2, 3)e.g. // [1, 2, 3] | Create array from arguments |
Array.of(3) | Creates [3], unlike new Array(3) which creates 3 empty slots |
Common Patterns
| Command | Description |
|---|---|
[...new Set(arr)] | Remove duplicates from array |
arr.filter(Boolean) | Remove falsy values (null, undefined, 0, "", false) |
arr.filter((v, i, a) => a.indexOf(v) === i) | Remove duplicates (pre-Set approach) |
Math.max(...arr) | Find maximum value in array |
Math.min(...arr) | Find minimum value in array |
arr.reduce((a, b) => a + b, 0) | Sum all elements |
arr.reduce((a, b) => a + b, 0) / arr.length | Calculate average |
arr.reduce((acc, val) => { acc[val] = (acc[val] || 0) + 1; return acc }, {}) | Count occurrences of each value |
arr.reduce((acc, obj) => ({ ...acc, [obj.id]: obj }), {}) | Convert array to lookup object by key |
arr.sort(() => Math.random() - 0.5) | Shuffle array (simple, not perfectly uniform) |
arr.slice(0, n) | Take first n elements |
Array.from({ length: Math.ceil(arr.length / n) }, (_, i) => arr.slice(i * n, i * n + n)) | Chunk array into groups of n |
arr1.filter(x => arr2.includes(x)) | Array intersection |
arr1.filter(x => !arr2.includes(x)) | Array difference (in arr1 but not arr2) |
[...new Set([...arr1, ...arr2])] | Array union (unique values from both) |
arr.map(fn).filter(Boolean) | Map and remove nulls in one chain |
📖 Free, searchable command reference. Bookmark this page for quick access.