Arrays: Array Recipes

Join the AI Workshop to learn more about AI and how it can be applied to web development. Next cohort February 1st, 2026

The AI-first Web Development BOOTCAMP cohort starts February 24th, 2026. 10 weeks of intensive training and hands-on projects.


Here’s a collection of common array operations and recipes for quick reference.

Get the last element

const colors = ['red', 'yellow', 'green', 'blue']
const lastItem = colors[colors.length - 1]

Get the index of an item

For primitive values, use indexOf():

const letters = ['a', 'b', 'c']
const index = letters.indexOf('b') //1

For objects, use findIndex():

const letters = [
  { letter: 'a' },
  { letter: 'b' },
  { letter: 'c' }
]

const index = letters.findIndex(element => element.letter === 'b') //1

Convert an array to a string

Use toString() or join():

const list = [1, 2, 3, 4]
list.toString() //'1,2,3,4'
list.join() //'1,2,3,4'
list.join(', ') //'1, 2, 3, 4'

Join two or more arrays

Use the spread operator or concat():

const first = ['one', 'two']
const second = ['three', 'four']

const result = [...first, ...second]
// or
const result = first.concat(second)

Empty an array

Set its length to 0:

const list = ['a', 'b', 'c']
list.length = 0

Or reassign to an empty array:

let list = ['a', 'b', 'c']
list = []

Divide an array in half

Use slice():

const list = [1, 2, 3, 4, 5, 6]
const half = Math.ceil(list.length / 2)

const firstHalf = list.slice(0, half)
const secondHalf = list.slice(half)

Reverse an array

Use reverse() (mutates the original):

const list = [1, 2, 3, 4, 5]
list.reverse() //[5, 4, 3, 2, 1]

To preserve the original, use spread first:

const list = [1, 2, 3, 4, 5]
const reversedList = [...list].reverse()

Shuffle an array

Use sort() with a random comparator:

let list = [1, 2, 3, 4, 5, 6, 7, 8, 9]
list = list.sort(() => Math.random() - 0.5)

Swap two elements

Use destructuring assignment:

const a = ['a', 'b', 'c', 'e', 'd'];
[a[3], a[4]] = [a[4], a[3]]
//['a', 'b', 'c', 'd', 'e']

Replace an item

Assign directly to the index:

const items = ['a', 'b', 'c', 'd', 'e', 'f']
items[2] = '--NEW--'
//['a', 'b', '--NEW--', 'd', 'e', 'f']

Remove duplicates

Use a Set:

const list = [1, 2, 3, 4, 4, 3]
const uniqueList = [...new Set(list)]
//[1, 2, 3, 4]

Find duplicates

const yourArray = [1, 1, 2, 3, 4, 5, 5]

let duplicates = []
const tempArray = [...yourArray].sort()

for (let i = 0; i < tempArray.length; i++) {
  if (tempArray[i + 1] === tempArray[i]) {
    duplicates.push(tempArray[i])
  }
}
//duplicates: [1, 5]

Flatten an array

Use flat():

['Dog', ['Sheep', 'Wolf']].flat()
//['Dog', 'Sheep', 'Wolf']

['Dog', ['Sheep', ['Wolf']]].flat(2)
//['Dog', 'Sheep', 'Wolf']

['Dog', ['Sheep', ['Wolf']]].flat(Infinity)
//['Dog', 'Sheep', 'Wolf']

Use flatMap() to combine map and flatten:

['My dog', 'is awesome'].flatMap(words => words.split(' '))
//['My', 'dog', 'is', 'awesome']

Get the first n items

Use slice():

const arrayToCut = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
const n = 5
const newArray = arrayToCut.slice(0, n)
//[1, 2, 3, 4, 5]

Divide an array into chunks

Split an array into equal-sized chunks:

const items = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
const n = 3 // items per chunk

const result = new Array(Math.ceil(items.length / n))
  .fill()
  .map(_ => items.splice(0, n))
//[[1, 2, 3], [4, 5, 6], [7, 8, 9], [10]]

Note: This mutates the original array. Use [...items] first if you need to preserve it.

Get unique property values from objects

Extract unique values of a property from an array of objects:

const bills = [
  { date: '2018-01-20', amount: '220', category: 'Electricity' },
  { date: '2018-01-20', amount: '20', category: 'Gas' },
  { date: '2018-02-20', amount: '120', category: 'Electricity' }
]

const categories = [...new Set(bills.map(bill => bill.category))]
//['Electricity', 'Gas']

Lessons in this unit:

0: Introduction
1: Number of items in an array
2: Create a new array from an existing array
3: Adding an item to an existing array
4: Adding at the beginning of an array
5: Adding multiple items to the array
6: Removing an item from an array
7: Modifying an existing array without mutating it
8: Arrays of arrays
9: Filling an array
10: Array destructuring
11: Check if an array contains a specific value
12: ▶︎ Array Recipes