Object 참조, 복사 정보

개요

Object를 복사할 때 착오가 있어서 메모로 썼어요.

실행 확인

http://runstant.com/supermuscles/projects/b2999826

참고 물품 인도

Object를 다른 변수에 직접 대입하는 경우 참조로만 전달됩니다.
참조처가 같기 때문에 대입처의 Object 내용이 바뀌면 원래의 Object 내용도 바뀐다.

  var base_obj = {str: 'hoge', num: 1};
  var copy_obj = base_obj; // 参照渡し
  copy_obj.num = 2; // 参照なのでbase_objの値も変わる
  console.log('base_obj', base_obj); // base_obj {"str": "hoge","num": 2}

얕은 복사

Object의 첫 번째 레이어만 복사합니다.
더 깊은 계층에 대해서는 참고일 뿐이다.
사용Object.assign.

  var base_obj = {str: 'hoge', num: 1, arr:[1,2,3,4,5]};
  var copy_obj = Object.assign({}, base_obj); // shallow copy
  copy_obj.str = 'fuga';
  copy_obj.arr[0] = 0; // 参照になってるのでbase_objのarrの値も変わってしまう
  console.log('base_obj', base_obj); // base_obj {"str": "hoge","num": 1,"arr": [0,2,3,4,5]
}

딥 카피

참조가 아닌 Object 컨텐트의 값을 복사합니다.
JSON 객체(JSON.stringify로 변환된 객체를 다시 Object의 작업JSON.parse으로 반환한 후 변수에 대입합니다.

  var base_obj = {str: 'hoge', num: 1, arr:[1,2,3,4,5]};
  var copy_obj = JSON.parse(JSON.stringify(base_obj)); // deep copy
  copy_obj.str = 'fuga';
  copy_obj.arr[0] = 0;
  console.log('base_obj', base_obj); //base_obj {"str": "hoge","num": 1,"arr": [1,2,3,4,5]
}

총결산

본인이 실제 업무에서 사용하기만 하면 복사원을 변경하고 싶지 않은 패턴이 많기 때문에 상술한 방법의 deep copy를 사용합니다
어레이의 복사본이라면 스프레드시트[...arr]로도 가능합니다.
원래는 여러 곳에서 같은 정보를 관리하는 것 자체가 복잡화의 원인이라고 생각했어요.
정말 복사가 필요합니까? 생각해 보는 것이 좋을 것 같습니다.