javascript 객체 깊은 복사(Deep Copy) VS 얕은 복사(Shallow Copy)

var object = {value: 15};
var copy_object = object;
object.value = 10;
console.log("object", object.value);
console.log("copy", copy_object.value);

위의 코드의 출력은 10 , 10로 나온다. 나는 object의 값만 변경하였는데 copy_object 값도 같이 바뀐것이다.

왜 10, 15으로 나오지 않는지 궁금하여 조사한 결과 얕은 복사가 되었기 때문이었다

 

 

얕은 복사 (Shallow Copy)

얕은 복사란 객체 내부의 값은 복사가 되었지만 내부의 객체 값은 복사되지 않았을때입니다. 메모리에 존재하는 객체를 가르키는 주소를 저장하고 있기때문에 copy_object는 object와 같은 주소값을 가지게 되어 같은 객체를 가르키게 되는것이다.

위의 코드는 얕은 복사코드이고 객체 자체를 복사하여 새로운 메모리에 올리기 위해서는 깊은 복사가 필요하다.

 

깊은 복사 (Deep Copy)

깊은 복사는 얕은 복사와는 달리 객체 내부의 객체의 상태를 복사하는 것입니다.  하나의 메모리 구조가 아닌 각기 다른 메모리에 저장됩니다.

 

var object = {value: 15};
var copy_object = {...object};
object.value = 10;
console.log("object", object.value);
console.log("copy", copy_object.value);

 

이코드는 깊은 복사가 되어 각기 다른 결과를 얻을수 있습니다.