먼저 상황요약

객체배열이 있음


const x = [

{val1:'some',val2:12},

     {val1:'some',val2:12},

{val1:'some',val2:12}

]


이 배열을 클라한테 리스폰스를 해야하는데

저 중 val2 라는값은 클라이언트한테 보여지면 안됨

그래서 배열을 돌면서 객체안에 val2라는 값을 삭제함

이때 이 x는 나중에 또 사용해야할때가 있어서 그대로 보존해둬야함

그래서 map으로 반복돌렸음


const m=arr.map(el=>{

delete x.val2

  return x

})



이렇게 하면 예상한대로라면 m이라는 배열은


[

{val1:'some'},

     {val1:'some'},

{val1:'some'}

]



이렇게 됬을꺼고 x는 그대로인 상태여야함

근데 실제 결과가 x까지 val2를 삭제한게 반영이됨





처음엔 뭔가 싶었는데

한가지 간과했던 사실이 delete할때 arr이 가리키는 원본객체를

직접 수정한다라는 사실을 까먹고있었음





객체를 다른 변수에 대입해봤을때도 결과는 마찬가지임

저 x랑 el은 결국엔 똑같은 객체를 가리키고 있으니 둘중 하나를 수정하면 둘다 바뀌는게 정상임



결국 원하는결과를 얻으려면 원본배열은 그대로 두고 그 배열을 수정한후 복사해서 리턴하도록함





예상대로 동작한다

위 코드는 예시니까 저렇게 작성한거고

js에 얕은복사,깊은복사 개념이 있다더라

근데 굳이 다 복사해서 또 delete 할 필요는없으니까 그냥 필요한것만 빼서넣고 리턴 해야할듯


가끔식 존나 당연한건데 왜 안돼지할때가 있더라 ㅇㅇ

또한번 기초의 중요성 체감