객체와 배열의 복사

최창서·2022년 4월 3일
0

객체와 배열의 복사 => Shallow-Copy /Deep Copy

사본을 바꾸면 원본도 같이 바뀌는 현상

스트링 넘버 불린과 다르게 객체와 배열은 주소가 복사되어 원본과 사본의 데이터를 수정시 모두 바뀐다

그렇다면 복사를 하기 위해서는 새로 변수를 만들어주고 중괄호 안에 내용을 붙여줘야 주소가 다르기때문에 사본을 수정해도 원본이 바뀌지 않는다.

이렇게하게되면 비효율적이다. 이를 해결하기위해 스프레드 연산자를 사용한다

단 이렇게하게되면 객체안에 객체가 있을때 안에있는 객체의 주소값이 복사되어 처음과 같은 문제가 발생한다

이러한 방법을 얕은 복사라고 한다 Shallow-Copy

깊은 복사를 하기 위해서는 배열을 우선 문자열로 바꿔주고 JSON.parse를 이용하여 다시 객체로 만들어준다 그렇게되면 사본을 변경하여도 원본은 변경되지 않는다.

문자열로 바꾸기 => JSON.stringify(profile)
객체로 바꾸기 => JSON.parse(Jason.stringify(profile))

하지만 JSON 문법의 경우 시간이 오래걸리기때문에 lodash에 cloneDeep 라이브러리를 사용하여 깊은 복사를 한다.

const로 객체를 선언한 경우 주소값을 가져왔기때문에 사본을 수정하면 원본이 수정이되고, 복사가 아닌 직접 선언해주는 것만 바뀌지 않는다

profile
프론트엔드 개발자

0개의 댓글