← Home
JavaScript Array Methods
Every JavaScript array method with syntax, description, and examples — from basics like push and pop to modern ES2023+ methods like toSorted, toReversed, and groupBy.
Creating Arrays
Array.from()Array.from(iterable, mapFn?)Creates an array from an iterable or array-like objectArray.from('abc') // ['a', 'b', 'c']Array.of()Array.of(...items)Creates an array from its arguments (unlike Array() which treats a single number as length)Array.of(3) // [3]Spread[...iterable]Expands an iterable into a new array[...'hi', ...['a']] // ['h', 'i', 'a']fill()arr.fill(value, start?, end?)Fills all or part of an array with a static value (mutates)[0,0,0].fill(7, 1) // [0, 7, 7]Array()new Array(length) / Array(length)Creates an array with given length (empty slots) or elementsArray(3).fill(0) // [0, 0, 0]Adding & Removing
push()arr.push(...items)Adds elements to the end, returns new length (mutates)[1,2].push(3) // returns 3; arr is [1,2,3]pop()arr.pop()Removes and returns the last element (mutates)[1,2,3].pop() // 3; arr is [1,2]unshift()arr.unshift(...items)Adds elements to the beginning, returns new length (mutates)[2,3].unshift(1) // returns 3; arr is [1,2,3]shift()arr.shift()Removes and returns the first element (mutates)[1,2,3].shift() // 1; arr is [2,3]splice()arr.splice(start, deleteCount?, ...items)Adds/removes elements at any position, returns removed (mutates)[1,2,3].splice(1, 1, 'a') // [2]; arr is [1,'a',3]concat()arr.concat(...values)Merges arrays and/or values into a new array (immutable)[1].concat([2], 3) // [1, 2, 3]Searching
find()arr.find(fn)Returns the first element that satisfies the test function[5,12,8].find(n => n > 10) // 12findIndex()arr.findIndex(fn)Returns the index of the first element that passes the test, or -1[5,12,8].findIndex(n => n > 10) // 1indexOf()arr.indexOf(value, fromIndex?)Returns the first index of a value, or -1 (uses strict equality)['a','b','c'].indexOf('b') // 1lastIndexOf()arr.lastIndexOf(value, fromIndex?)Returns the last index of a value, searching backwards[1,2,1].lastIndexOf(1) // 2includes()arr.includes(value, fromIndex?)Returns true if the array contains the value (handles NaN)[1,2,3].includes(2) // truesome()arr.some(fn)Returns true if at least one element passes the test[1,3,5].some(n => n % 2 === 0) // falseevery()arr.every(fn)Returns true if all elements pass the test[2,4,6].every(n => n % 2 === 0) // trueTransforming
map()arr.map(fn)Creates a new array by transforming every element[1,2,3].map(n => n * 2) // [2, 4, 6]filter()arr.filter(fn)Creates a new array with elements that pass the test[1,2,3,4].filter(n => n > 2) // [3, 4]reduce()arr.reduce(fn, initialValue?)Reduces the array to a single value by accumulating left-to-right[1,2,3].reduce((a, b) => a + b, 0) // 6reduceRight()arr.reduceRight(fn, init?)Like reduce but iterates from right to left[[1],[2],[3]].reduceRight((a, b) => a.concat(b)) // [3,2,1]flat()arr.flat(depth?)Flattens nested arrays to the specified depth (default 1)[1,[2,[3]]].flat(Infinity) // [1, 2, 3]flatMap()arr.flatMap(fn)Maps each element then flattens one level — more efficient than map+flat[1,2].flatMap(n => [n, n*2]) // [1,2,2,4]sort()arr.sort(compareFn?)Sorts in place. Without compareFn, sorts as strings (mutates)[3,1,2].sort((a,b) => a - b) // [1, 2, 3]reverse()arr.reverse()Reverses the array in place (mutates)[1,2,3].reverse() // [3, 2, 1]slice()arr.slice(start?, end?)Returns a shallow copy of a portion (immutable)[1,2,3,4].slice(1, 3) // [2, 3]Iterating
forEach()arr.forEach(fn)Executes a function for each element (returns undefined)[1,2,3].forEach(n => console.log(n))entries()arr.entries()Returns an iterator of [index, value] pairs[...[10,20].entries()] // [[0,10],[1,20]]keys()arr.keys()Returns an iterator of indices[...[10,20].keys()] // [0, 1]values()arr.values()Returns an iterator of values[...[10,20].values()] // [10, 20]Converting
join()arr.join(separator?)Joins all elements into a string with a separator (default ',')['a','b','c'].join('-') // 'a-b-c'toString()arr.toString()Returns a comma-separated string of the elements[1,2,3].toString() // '1,2,3'Array.from()Array.from(setOrMap)Converts iterables like Set, Map, NodeList to arraysArray.from(new Set([1,1,2])) // [1, 2]Array.isArray()Array.isArray(value)Returns true if the value is an arrayArray.isArray([1]) // trueModern Methods (ES2022+)
at()arr.at(index)Returns the element at the given index — supports negative indices[1,2,3].at(-1) // 3findLast()arr.findLast(fn)Like find() but searches from the end[1,12,5,14].findLast(n => n > 10) // 14findLastIndex()arr.findLastIndex(fn)Like findIndex() but searches from the end[1,12,5,14].findLastIndex(n => n > 10) // 3toSorted()arr.toSorted(compareFn?)Returns a new sorted array without mutating the original[3,1,2].toSorted() // [1,2,3] (original unchanged)toReversed()arr.toReversed()Returns a new reversed array without mutating the original[1,2,3].toReversed() // [3,2,1] (original unchanged)toSpliced()arr.toSpliced(start, deleteCount, ...items)Like splice() but returns a new array (immutable)[1,2,3].toSpliced(1, 1, 'a') // [1,'a',3]with()arr.with(index, value)Returns a new array with one element replaced at the given index[1,2,3].with(1, 'b') // [1,'b',3]Object.groupBy()Object.groupBy(arr, fn)Groups elements by key returned from the callback (ES2024)Object.groupBy([1,2,3], n => n % 2 ? 'odd' : 'even')FAQ
What is the difference between map() and forEach()?
map() creates and returns a new array with the results of calling a function on every element. forEach() just executes a function for each element and always returns undefined. Use map() when you need the transformed array, and forEach() for side effects only.
When should I use reduce() vs a for loop?
reduce() is ideal for accumulating a single result from an array (sums, objects, flat arrays). A for loop can be more readable for complex multi-step logic. Performance is similar in modern engines — choose based on readability for your team.
What are the new immutable array methods in ES2023?
ES2023 introduced toSorted(), toReversed(), toSpliced(), and with(). These are immutable counterparts of sort(), reverse(), splice(), and bracket-assignment — they return new arrays instead of mutating the original. Supported in all modern browsers since mid-2023.
How do I remove duplicates from an array?
The simplest approach is [...new Set(array)], which works for primitives. For objects, use filter() with a Set tracking seen keys, or reduce() to build a map. Libraries like Lodash offer _.uniqBy() for complex deduplication.