[자바스크립트] 얕은 복사와 깊은 복사

박은정·2022년 2월 22일
0

자바스크립트

목록 보기
20/25
post-thumbnail

얕은 복사와 깊은 복사

얕은 복사는 바로 아래 단계의 값만 복사하는 방법이고, 깊은 복사는 내부의 모두 값들을 모두 찾아서 복사하는 방법입니다.

중첩된 객체에서 참조형 데이터가 저장된 프로퍼티를 복사할 때 그 주솟값만 복사합니다. 그러면 해당 프로퍼티에 대해 원본과 사본이 모두 동일한 참조형 데이터의 주소를 가리키게 되서 원본과 사본 둘 중 하나를 바꾸면 나머지도 바뀌게 됩니다.

이러한 문제를 해결하기 위해 copyObject() 메서드를 활용해서 객체복사를 할 수 있습니다만 이 또한 객체에 직접 속한 프로퍼티에 대해서만 새로운 데이터가 만들어지는 반면, 참조형 데이터의 프로퍼티를 가지게 된다면 해당 객체의 내부 프로퍼티들은 기존의 데이터를 그대로 참조하게 됩니다.

이런식으로 참조형 데이터를 내부 프로퍼티로 가지고 있을 때에는 다시 그 내부의 프로퍼티를 모두 복사하는 깊은 복사를 해야 원본과 사본이 서로 완전히 다른 데이터를 참조하게 되어 어느 쪽의 프로퍼티를 변경하더라도 다른 쪽에 영향을 주지 않습니다.

깊은 복사를 하는 간단한 방법

기본적으로 내부 프로퍼티를 일일히 복사하면 되지만, 라이브러리를 사용하거나 다음과 같은 방법을 사용하면 간단하게 깊은 복사를 할 수 있습니다.

  • array type의 데이터 깊은 복사 : ...연산자
  • object type의 데이터 깊은 복사 : 객체를 JSON문법으로 표현된 문자열로 전환했다가 다시 JSON객체로 바꾸면 됩니다.

다만 메서드나 숨겨진 프로퍼티인 __proto__getter/setter 등과 같이 JSON으로 변경할 수 없는 데이터는 모두 무시하기 때문에 httpRequest로 받은 데이터를 저장한 객체를 복사할 때처럼 순수한 정보만을 다룰 때 활용하면 좋습니다.

profile
새로운 것을 도전하고 노력한다

0개의 댓글