인프런 커뮤니티 질문&답변

ywj님의 프로필 이미지

작성한 질문수

[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

2.5) 원시타입 VS 객체타입

객체 타입의 얕은 복사와 깊은 복사에 대해 질문 있습니다

해결된 질문

24.07.14 14:26 작성

·

144

0

안녕하세요~

2.5) 원시타입 vs 객체타입 강의의 8분 6초 쯤에 객체의 얕은 복사와 깊은 복사에 대해 설명해주시는 부분이 있는데요.

중첩객체에서는 spread 연산자를 사용해서 복사를 해도 1 depth까지는 복사가 되는데, 2 depth 이상 부터는 복사되지 않는 걸로 알고 있습니다.

그래서 spread 연산자를 사용한 복사를 얕은복사,

JSON.stringify() 등을 이용해서 하위 중첩된 객체들까지 복사하는 것을 깊은 복사라고 하는 걸로 알고 있는데

혹시 제가 잘못 알고 있는건지 궁금해서 질문남깁니다!

답변 2

3

이정환 Winterlood님의 프로필 이미지
이정환 Winterlood
지식공유자

2024. 07. 15. 09:28

안녕하세요 이정환입니다

이는 복사하려는 객체의 Depth에 따라 달라질 수 있습니다.

말씀하신대로 객체의 Depth가 강의에서 다룬 것 처럼 1 Depth에서 그친다면 문제 없이 깊은 복사가 이루어지나

2 Depth 부터는 제대로 동작하지 않게됩니다.

따라서 복사하시려는 객체의 Depth에 따라 깊은 복사와 얕은 복사를 사용할 수 있는 방법이 달라진다고 이해하시면 될 것 같습니다.

ywj님의 프로필 이미지
ywj
질문자

2024. 07. 15. 13:33

네 이해했습니다 설명 감사합니다!!

2

인프런 AI 인턴님의 프로필 이미지

2024. 07. 14. 14:31

안녕하세요, 인프럽 AI 인턴입니다.

ywj님께서 질문하신 객체 타입의 얕은 복사와 깊은 복사에 관한 부분에 대해, 말씀해주신 내용은 정확합니다. 스프레드 연산자([…])를 사용한 복사는 얕은 복사(shallow copy)에 해당하며, 이는 객체의 가장 바깥쪽 레벨의 값을 복사하는 것을 의미합니다. 즉, 중첩된 객체에 대해서는 참조값을 복사하게 됩니다. 따라서 중첩된 객체 내부의 값이 변경되면, 복사된 객체에서도 이러한 변경이 반영됩니다.

반면, JSON.stringify()JSON.parse() 메소드를 이용하는 방식은 깊은 복사(deep copy)를 수행합니다. 이 방법은 객체를 문자열로 변환한 후 다시 객체로 변환하는 과정을 거쳐, 원본 객체와는 완전히 독립된 새로운 객체를 생성합니다. 이 과정에서 중첩된 객체까지 모두 새로운 메모리 주소에 할당되므로, 원본 객체 내부의 변경이 복사된 객체에 영향을 주지 않습니다.

다만, JSON.stringify()JSON.parse() 메소드를 이용한 깊은 복사는 몇가지 제약사항이 있습니다. 예를 들어, 메소드나 순환 참조가 있는 객체는 정상적으로 복사되지 않습니다. 이러한 경우에는 라이브러리(Lodash의 _.cloneDeep() 등)를 이용하거나, 재귀적 알고리즘을 구현하여 깊은 복사를 수행할 수 있습니다.

이와 관련하여 구체적 사례를 볼 수 있는 강의 질문 글이 있으니 참고하시면 도움이 될 것 같습니다. 여기서는 JSON.parse(JSON.stringify())를 이용한 깊은 복사와 스프레드 연산자를 사용한 얕은 복사의 차이점에 대해 설명되어 있습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

ywj님의 프로필 이미지

작성한 질문수

질문하기