개발노트 :: 자바스크립트(JavaScript) 객체 복사

참조에 의한 객체 복사 

  let user1 = {
    name : '홍길동'
  }
  
  let user2 = user1;

  user1.name = '강감찬';

  console.log(user1.name);	// 강감찬
  console.log(user2.name);	// 강감찬

 

javscript는 객체가 할당될 때 참조 값에 의해 복사가 됩니다. 
메모리에 name이라는 프로퍼티가 생성이 되고 각 객체는 메모리에 위치하는 주소 값(참조값)을 할당받게 됩니다.
user1이나, user2는 같은 name주소를 가르키고 있어서 한쪽 객체에서 변경을 시도하면 다른 객체에서도 변경된 값을 보게 됩니다. 

 

독립적인 객체 복제 Object.assign()

  let user1 = {
    name : '홍길동',
	info : {
	  addr : '서울',
	  age : 20
	}
  }
  let user2 = {}

  Object.assign(user2, user1);
  user1.name='강감찬';
  user1.info.addr='부산';

  console.log(user1.name);	// 강감찬
  console.log(user1.info.addr);	// 부산

  console.log(user2.name);	// 홍길동
  console.log(user2.info.addr);	// 부산

Object.assign을 이용해 객체를 독립적으로 복사가 가능합니다. 
하지만 객체안에 다른 객체가 있다고 하면 그 객체는 주소 값을 참조하기 때문에 주의를 해야 합니다. 

중첩 객체를 복사하기 위해서는 직접 코드를 작성하는 방법도 있겠지만 lodash라이브러리를 이용한 _.cloneDeep(obj)를 활용하는게 빠르고 편리합니다. 

let target = _.cloneDeep(obj);