자바스크립트 copy (객체 복사)

kinds of copy ?

자바스크립트에서 복사는 깊은 복사(deep copy) 와 얕은 복사(shallow copy) 가 존재합니다.

String , Boolean , Number 등 원시 타입(primitive type) 을 가지는 데이터는 복사가 일어날 때

새로운 메모리 공간을 확보해 생성하게 되어 메모리에 독립적인 값을 저장합니다.

object (객체, 배열, 함수) 와 같은 참조 타입(reference type) 을 가지는 데이터는 변수에 저장하게

되면 메모리 절약을 위해 포인터만 새로 할당합니다. 즉 실제 값을 저장하는 것이 아니고 객체를 메모리

어딘가에 객체의 위치 값을 저장합니다.

---

Copy

example

 

Deep Copy

let A = 1;
let B = A;
// 깊은 복사가 일어나며 B 는 메모리에 독립적인 값을 저장합니다.

console.log(A) // 1
console.log(B) // 1

A = 2;
// A 의 값이 바뀌어도 B 는 메모리에 독립적인 값을 가지고 있기에 영향을 주지 않습니다.

console.log(A) // 2
console.log(B) // 1

shallow copy

let origin = [1,2,3,4];
let copy = origin;
// 얕은 복사가 일어나며 copy 는 origin 과 같은 주소값을 바라봅니다.

console.log(origin) // [1,2,3,4]
console.log(copy)   // [1,2,3,4]

origin[0] = 5;
// 같은 주소를 바라보고 있으므로 origin 과 copy 모두 변경됩니다.

console.log(origin) // [5,2,3,4]
console.log(copy)   // [5,2,3,4]

copy[0] = 6

console.log(origin) // [6,2,3,4]
console.log(copy)   // [6,2,3,4]

---

객체를 deep copy 하는 방법들도 물론 존재합니다!

 

https://flaviocopes.com/how-to-clone-javascript-object/

How to deep clone a JavaScript object

---

참고 reference

 

https://scotch.io/bar-talk/copying-objects-in-javascript

Copying Objects in JavaScript