EN
JavaScript - copy array
3
points
In this article, we would like to show you how to copy an array in JavaScript.
Quick solution:
// ONLINE-RUNNER:browser;
let array1 = [1, 2, 3, 4, 'xyz'];
let array2 = array1.slice();
array2[3] = 'value';
console.log(array1); // [1, 2, 3, 4, "xyz"]
console.log(array2); // [1, 2, 3, "value", "xyz"]
The below assignment doesn't work because you are assigning not the values inside the array but its reference (we don't want this):
// ONLINE-RUNNER:browser;
let array1 = [1, 2, 3, 4, 'xyz'];
let array2 = array1;
array2[3] = 'value';
console.log(array1); // [1, 2, 3, "value", "xyz"]
console.log(array2); // [1, 2, 3, "value", "xyz"]
Here are some methods on how to create a new copied array:
Array.concat()
- using spread operator '
...
' Array.slice()
Array.from()
1. Array concat()
method
// ONLINE-RUNNER:browser;
let array1 = [1, 2, 3, 4, 'xyz'];
let array2 = [].concat(array1);
array2[3] = 'value';
console.log(array1); // [1, 2, 3, 4, "xyz"]
console.log(array2); // [1, 2, 3, "value", "xyz"]
2. Spread operator
// ONLINE-RUNNER:browser;
let array1 = [1, 2, 3, 4, 'xyz'];
let array2 = [...array1];
array2[3] = 'value';
console.log(array1); // [1, 2, 3, 4, "xyz"]
console.log(array2); // [1, 2, 3, "value", "xyz"]
3. Array slice()
// ONLINE-RUNNER:browser;
let array1 = [1, 2, 3, 4, 'xyz'];
let array2 = array1.slice();
array2[3] = 'value';
console.log(array1); // [1, 2, 3, 4, "xyz"]
console.log(array2); // [1, 2, 3, "value", "xyz"]
4. Array from()
// ONLINE-RUNNER:browser;
let array1 = [1, 2, 3, 4, 'xyz'];
let array2 = Array.from(array1);
array2[3] = 'value';
console.log(array1); // [1, 2, 3, 4, "xyz"]
console.log(array2); // [1, 2, 3, "value", "xyz"]
5. Array map()
// ONLINE-RUNNER:browser;
let letters = ['A', 'B', 'C'];
let copy = letters.map((x) => x);
console.log(letters);
console.log(copy);