I have a code snippet as below
let arr1 = [{status : true , name : "one"} , {status : false , name : "two"} , {status : true , name : "three"}]
let arr2 = arr1.slice();
for(let i=0; i<arr2.length ; i++){
if(!arr2[i].status){
arr2[i].status = true;
}
}
console.log("arr1....." , arr1);
console.log("arr2......",arr2)
In this case both arr1 and arr2 are modified. My expected result is just to update arr2 and not arr1 (only using a simple for loop)
How can I achieve this?
Objects inside arrays point same references, so if you update an object in arr2 it will update same object in arr1. So you have 2 options,
arr1 while assigning arr2 (deep copy means copy even objects inside, may run slower)let arr1 = [{status : true , name : "one"} , {status : false , name : "two"} , {status : true , name : "three"}]
let arr2 = JSON.parse(JSON.stringify(arr1));
for(let i=0; i<arr2.length ; i++){
if(!arr2[i].status){
arr2[i].status = !arr2[i].status;
}
}
console.log("arr1....." , arr1);
console.log("arr2......",arr2)2. Copy object(you would like to change), add changed field as below
let arr1 = [{status : true , name : "one"} , {status : false , name : "two"} , {status : true , name : "three"}]
let arr2 = [...arr1];
for(let i=0; i<arr2.length ; i++){
if(!arr2[i].status){
arr2[i] = {...arr2[i], status:!arr2[i].status};
}
}
console.log("arr1....." , arr1);
console.log("arr2......",arr2)How about change a way to copy the array?
To explain why slice() will make both of them updated, that is because because the array.slice() also copy the reference of the orginial array.
So, whenever the original array changed, the copied array also changed
let arr1 = [{status : true , name : "one"} , {status : false , name : "two"} , {status : true , name : "three"}]
const arr2 = JSON.parse(JSON.stringify(arr1));
for(let i=0; i<arr2.length ; i++){
if(!arr2[i].status){
arr2[i].status = true;
}
}
console.log("arr1....." , arr1);
console.log("arr2......",arr2)You are creating a new array but the objects inside it are still referencing the original ones. You need to create new references for these objects. Use the following instead of let arr2 = arr1.slice(); This would be the "Deep Copy" approach that @Tuba Polat mentioned.
let arr2 = arr1.map(oldObj => { return { ...oldObj } })