Arrays: Create a new array from an existing array

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.


Sometimes you want to create a new array from an existing array.

The simplest way is to use the spread operator:

const fruits = ['banana', 'pear', 'apple']

const morefruits = [...fruits]

console.log(morefruits)
//[ 'banana', 'pear', 'apple' ]

How does it work? When we use ...fruits we basically expand the content of fruits. Since we enclosed that in the array literal syntax [], we’ll end up creating a new array morefruits, with the original content of fruits.

Now we can modify the morefruits array without affecting in any way the original fruits array.

Important: note that this only works with primitive types. When you store objects in the array, things change, because you are storing the object reference, not its content.

You’ll see more about this when we’ll talk about objects.

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