상세 컨텐츠

본문 제목

[javaScript] const obj2 = obj1 하면 얕은복사가된다.

카테고리 없음

by esoesmio 2024. 5. 15. 19:18

본문

const obj1 = {
    num:1, str:'abc',bool:true

}
const obj2 = obj1;
console.log(obj2);
console.log(obj1);

obj2.num = 125;
console.log(obj2);
console.log(obj1);

실제로 여기서 보여지는 현상은 "깊은 복사(deep copy)"가 아닌 "얕은 복사(shallow copy)" 때문에 발생합니다. `obj2 = obj1;` 이라는 할당은 `obj1`이 가리키는 객체의 주소를 `obj2`에 복사하는 것이지, 객체 내부의 값을 새로운 메모리 위치에 복사하는 것은 아닙니다.

이런 식으로 할당하면, `obj1`과 `obj2`는 메모리 상에서 같은 객체를 가리키게 됩니다. 따라서, `obj2`를 통해 객체의 속성을 변경하면, `obj1`을 통해서도 같은 객체의 변경된 속성을 볼 수 있습니다. 반대로 `obj1`을 통해 속성을 변경하면 `obj2`에서도 변경 사항을 볼 수 있습니다.

만약 객체를 "깊은 복사" 하여 `obj1`과 `obj2`가 서로 독립적인 객체를 가리키게 하려면, 객체의 모든 요소를 새로운 객체로 복사해야 합니다. JavaScript에서 깊은 복사를 하는 방법 중 하나는 다음과 같습니다:

```javascript

const obj1 = {
    num: 1,
    str: 'abc',
    bool: true
};

// 깊은 복사를 위해 JSON 메서드를 사용
const obj2 = JSON.parse(JSON.stringify(obj1));

// obj2의 속성을 변경
obj2.num = 125;

console.log(obj2); // { num: 125, str: 'abc', bool: true }
console.log(obj1); // { num: 1, str: 'abc', bool: true }


```

이 방법은 객체 안의 모든 값들을 문자열로 변환한 뒤 다시 객체로 변환하여 새로운 객체를 생성합니다. 하지만 이 방법은 함수, 심볼, undefined 등 일부 데이터 타입이나 순환 참조를 포함하는 객체에는 적용할 수 없으므로 주의가 필요합니다.

댓글 영역