map() 메서드에서는 객체의 얕은 복사가 이루어지므로 리턴된 배열의 각 객체는 원본 배열의 참조를 그대로 가집니다.

 

map() 메서드는 원본 배열의 각 요소를 변환하여 새로운 배열을 생성합니다. 이때, 원본 배열의 요소가 객체인 경우, map() 메서드로 생성된 새로운 배열의 각 요소는 원본 배열의 객체를 참조하게 됩니다. 따라서 새로운 배열의 객체를 수정하면 원본 배열의 해당 객체도 영향을 받습니다.

 

const originalArray = [{ id: 1, value: 'a' }, { id: 2, value: 'b' }];

const newArray = originalArray.map(item => item);

// 새로운 배열의 첫 번째 객체 수정
newArray[0].value = 'z';

console.log(originalArray[0].value); // 출력: 'z'

 

위 코드에서 originalArray와 newArray는 서로 다른 배열이지만, 각 배열의 요소인 객체는 동일한 참조를 공유합니다. 따라서 newArray[0].value를 변경하면 originalArray[0].value도 함께 변경됩니다.

이러한 동작은 JavaScript에서 객체가 참조 타입이기 때문에 발생합니다. 객체를 복사할 때는 얕은 복사와 깊은 복사의 개념을 이해하고, 필요한 경우 깊은 복사를 수행하여 원본 객체와의 참조 관계를 끊어야 합니다.

자세한 내용은 JavaScript의 얕은 복사와 깊은 복사를 참고하시기 바랍니다.