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?

CodePudding user response：

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,

1. Deep copy 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)

CodePudding user response：

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)

CodePudding user response：

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 } })