TIL 63 | 얕은 복사 vs 깊은 복사

song hyun·2022년 6월 7일
0

JavaScript

목록 보기
18/19
post-thumbnail

Shallow Copy

  • 얕은 복사(Shallow Copy)는 바로 아래 단계의 값만 복사하는 방법이다.
  • 얕은 복사는 중첩된 객체에서 참조형 데이터가 저장된 프로퍼티를 복사할 때 그 주소값만 복사한다는 의미이다.
  • 그러면 해당 프로퍼티의 대해 원본과 사본이 동일 참조형 데이터의 주소를 가리키게 되므로, 사본을 바꾸면 원본도 바꾸고, 원본을 바꾸면 사본도 바뀌게 된다.
  • 원시 데이터 타입일 경우에는 그대로 복사하지만, 참조형 데이터 타입의 경우에는 그 내부의 데이터 프로퍼티까지 복사해야 합니다.
const obj = { value: 1 };
const copy_obj = obj;

copy_obj.value = 2;
console.log(obj === copy_obj); // true

Decp Copy

  • 깊은 복사(Decp Copy)는 내부의 모든 값들을 하나하나 찾아서 전부 찾아서 복사하는 방법이다.
  • 깊은 복사는 참조형 데이터 타입의 객체가 있을 경우에 원본과의 참조가 끊어진 객체를 의미한다.
  • JSON.stringfy() 객체를 json 문자열로 변환하는 과정에 원본 객체와의 참조가 모두 끊어진다.
const obj = { a: "a", number: { one: 1, two: 2 }, arr: [1, 2, [3, 4]] };
const copy = JSON.parse(JSON.stringify(obj));

copy.number.one = 3;
copy.arr[2].push(5);
console.log(object === copy); // false
console.log(object.number.one === copy.number.one); // false
console.log(object.arr === copy.arr); // false
profile
Front-end Developer 🌱

0개의 댓글