Cloning an Array in JavaScript

You can clone a JavaScript array using the Object.assign() and array.forEach() methods, a for loop, or a spread operator (the fastest way). The Object.assign() method creates a shallow array copy of all enumerable properties from one or more source objects. The spread operator ("...") is handy and fast but has been available since ECMAScript 6 and can be used to clone JavaScript arrays by expanding them. This spread operator clones multidimensional JavaScript arrays by reference, not by value. In this JavaScript Array Cloning Example, we use the spread ("...") operator to clone an array. More JavaScript array cloning examples are shown below. Click on Execute to run JavaScript Clone Array Example online and see the results.
Cloning an Array in JavaScript Execute
let array = ['Apple', 'Orange', 'Melon'];
 
let clone = [...array];

console.log(clone);
Updated: Viewed: 4291 times

Clone JavaScript array using Object.assign() method

You can clone JavaScript arrays using the Object.assign() method. The method is used to copy properties from the source object to the target object by passing an array as a source value and an empty object as a destination value. Below is an example of cloning an array using the Object.assign() method:

JavaScript Clone Array using Object.assign()
let array = ['Pineapple', 'Strawberry', 'Peach'];
 
let clone = Object.assign(array);

console.log(clone);

// output: ['Pineapple', 'Strawberry', 'Peach']

Clone JavaScript array using array.reduce() method

You can clone JavaScript arrays using the array.reduce(callback, initialValue) method. The reduce() method executes a callback function for each array element. Below is an example of cloning an array using the array.reduce() method:

JavaScript Clone Array using array.reduce()
let array = ['Apple', 'Orange', 'Melon'];
 
const callback = (arr, value, index) => {
	arr[index] = value;
	return arr;
};
 
let clone = array.reduce(callback, []);

console.log(clone);

// output: ['Apple', 'Orange', 'Melon']

Clone JavaScript array using array.forEach() method

You can clone JavaScript arrays using the array.forEach(callback, thisValue) method. This method executes a function for each array element. Below is an example of cloning an array using the array.forEach() method:

JavaScript Clone Array using array.forEach()
let array = ['Grape', 'Pear', 'Cherry'];
 
let clone = [];

array.forEach((value, index) => clone[index] = value);

console.log(clone);

// output: ['Grape', 'Pear', 'Cherry']

Clone JavaScript array using Spread Operator

You can clone JavaScript arrays using the spread ("...") operator. The spread operator ("...") was added to JavaScript in the ES6 standard. JavaScript arrays can be cloned using the following syntax: [...array]. Below is an example of cloning an array using the spread operator:

JavaScript Clone Array using Spread Operator
let array = ['a', 'b', 'c'];
 
let clone = [...array];

console.log(clone);

// output: ['a', 'b', 'c']

Clone JavaScript array using for loop

You can also clone JavaScript arrays by using a for loop. Here is an example of cloning an array with the use of a for loop:

JavaScript Clone Array using for loop
let array = ['Raspberry', 'Apple', 'Mango'];
 
let clone = [];

for (let i = 0 ; i < array.length; i++) {
    clone[i] = array[i];
}
 
console.log(clone);

// output: ['Raspberry', 'Apple', 'Mango']

See also