Array Methods

Beyond adding and removing at the ends, arrays have methods for searching, slicing out sections, inserting in the middle, combining arrays and flattening nested ones. A key skill is knowing which methods change the original array and which return a new one.

Searching

const pets = ["cat", "dog", "fish", "dog"];

console.log(pets.includes("fish"));
console.log(pets.indexOf("dog"));
console.log(pets.lastIndexOf("dog"));
console.log(pets.indexOf("bird"));

true
1
3
-1

includes answers "is it there?"; indexOf tells you where (or -1). Both compare with strict equality, so they work for primitives but can't find an object by its contents — use find/findIndex for that (next lesson).

slice: copy a section

slice(start, end) returns a new array with items from start up to, but not including, end. The original is untouched:

const letters = ["a", "b", "c", "d", "e"];

console.log(letters.slice(1, 3));
console.log(letters.slice(2));
console.log(letters.slice(-2));
console.log(letters.slice());
console.log(letters);

[ 'b', 'c' ]
[ 'c', 'd', 'e' ]
[ 'd', 'e' ]
[ 'a', 'b', 'c', 'd', 'e' ]
[ 'a', 'b', 'c', 'd', 'e' ]

splice: insert and remove anywhere

splice(start, deleteCount, ...itemsToInsert) changes the array in place and returns the removed items:

const months = ["Jan", "Mar", "Apr", "Jun"];

months.splice(1, 0, "Feb");
console.log(months);

const removed = months.splice(3, 1);
console.log(removed, months);

months.splice(3, 1, "May", "Jun");
console.log(months);

[ 'Jan', 'Feb', 'Mar', 'Apr', 'Jun' ]
[ 'Apr' ] [ 'Jan', 'Feb', 'Mar', 'Jun' ]
[ 'Jan', 'Feb', 'Mar', 'May', 'Jun' ]

The names are easy to mix up: slice copies, splice modifies.

Non-mutating alternatives

Since 2023, arrays have "change by copy" versions of the mutating methods. They return a new array and leave the original alone — handy in frameworks like React, where state must not be modified directly:

const nums = [3, 1, 2];

console.log(nums.toSorted());
console.log(nums.toReversed());
console.log(nums.toSpliced(1, 1));
console.log(nums.with(0, 99));
console.log(nums);

[ 1, 2, 3 ]
[ 2, 1, 3 ]
[ 3, 2 ]
[ 99, 1, 2 ]
[ 3, 1, 2 ]

Combining and joining

const a = [1, 2];
const b = [3, 4];

console.log(a.concat(b));
console.log([...a, ...b, 5]);
console.log(["2026", "10", "06"].join("-"));
console.log([1, 2, 3].join(""));

[ 1, 2, 3, 4 ]
[ 1, 2, 3, 4, 5 ]
2026-10-06
123

Spread syntax is the most flexible way to combine arrays. join turns an array into a string with any separator (comma by default).

Reversing and filling

const order = [1, 2, 3];
order.reverse();
console.log(order);

const seats = new Array(5).fill("free");
seats.fill("taken", 1, 3);
console.log(seats);

[ 3, 2, 1 ]
[ 'free', 'taken', 'taken', 'free', 'free' ]

Flattening nested arrays

const nested = [1, [2, 3], [4, [5, 6]]];

console.log(nested.flat());
console.log(nested.flat(Infinity));

const sentences = ["hello world", "good morning"];
console.log(sentences.flatMap(s => s.split(" ")));

[ 1, 2, 3, 4, [ 5, 6 ] ]
[ 1, 2, 3, 4, 5, 6 ]
[ 'hello', 'world', 'good', 'morning' ]

flat() flattens one level by default; pass a depth or Infinity for more. flatMap maps each item to an array and flattens the result one level.

Mutating vs non-mutating

Try it yourself