TIL27: Shallow and Deep Copy

• Shallow Copy : Clone and Merge

let user = {
 name: 'John',
 age: 30
}
// 완전히 독립된 복사본 생성
let clone = {};
for (let key in user) {
  clone[key] = user[key];
}
clone.name = 'Pete';
console.log(user.name, clone.name); // John Pete

Object의 메소드를 이용하는 방법도 있습니다. : Object.assign({}, obj)

let user = {
 name: 'John',
 age: 30
}
let clone = Object.assign({}, user);
clone.name = 'Pete';
console.log(user.name, clone.name); // John Pete

이와 같이 객체의 모든 속성 값이 Primitive Type일 경우에는 Shallow Copy만으로도 객체의 복사가 가능합니다. 하지만 속성 값이 또 다른 객체(Nested Object)인 구조일 경우에는 복사본의 Key에 참조하는 주소값이 복사되므로 중첩 객체의 구조까지 복사(Nested Cloning)해주는 반복문을 사용해야 합니다.

이 때 사용되는 표준 알고리즘이 Structured Cloning Algorithm이며, 자바스크립트 라이브러리인 "lodash"의 메소드인 _.cloneDeep(obj)를 사용하면 이 알고리즘을 직접 구현하지 않고서도 Deep Copy를 할 수 있습니다.

코드 출처: JAVASCRIPT.INFO