How do I clone a JavaScript array?

You can clone a JavaScript array by calling Object.assign(), array.reduce() or array.forEach(). The Object.assign() method allows you to shallow copy the values of all enumerable properties and methods from one or more source objects to the target object (passing an array as the source object and an empty object as the target). The array.reduce() method sequentially processes each element in an array, saving the intermediate result. The reduce() method takes as an argument a callback function that is executed for each element in the array. The array.forEach() method allows you to execute the given function once for each element in the array. The passed function can perform any operation on the elements of the given array. The Spread Operator ("...") is available since ECMAScript 6 and can be used to expand an array where object literals should be used. In this JavaScript array cloning example, we use the spread operator ("..."). Click on Execute to run JavaScript Clone Array Example online and view the results.
How do I clone a JavaScript array? Execute
let array = ['Apple', 'Orange', 'Melon'];
 
let clone = [...array];

console.log(clone);
Updated: Viewed: 537 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