
[Javascript] 배열 복사

추유나
2026. 02. 24. 오후 04:03·14
#깊은 복사#얕은 복사
용어 설명
- 얕은 복사 : 데이터가 아닌 메모리 주소를 복사하는 방식
- 깊은 복사 : 새로운 메모리 공간에 원본 데이터를 복사하는 방식
얕은 복사의 문제점
- 메모리 주소를 복사하는 방식이다보니,
복사본의 값을 바꾸게 되면 같은 주소를 사용하고 있는 원본의 데이터도 값이 같이 변하게 된다.
깊은 복사는 Javascript에서 어떻게 사용하나?
-
structuredClone()
데이터 전체를 훑어 가장 깊은 곳까지 새 메모리에 똑같이 복사하는 방식 -
JSON.parse(JSON.stringify())
객체를 문자열로 직렬화한 후 다시 객체로 역직렬화하여 새 메모리에 데이터 저장하는 방식
단, 문자열로 변환이 불가능한 함수, undefined 같은 것들은 데이터 손실될 수 있음. -
Lodash 라이브러리
객체의 가장 안쪽 끝단까지 직접 찾아 들어가 하나씩 새 메모리에 저장하는 방식
깊은 복사를 쉽게 해주는 기술은?
- structuredClone() 함수 사용이 가장 빠르고 정확!
const 복사본 = structuredClone(원본);
프론트엔드(브라우저)와 서버 간의 통신에서 JSON이 사용되는 이유?
- 브라우저와 서버간의 통신을 할 때, 객체로는 통신이 불가능하고 텍스트로만 통신이 가능하기 때문에 json을 사용함.
이때 직렬화와 역직렬화가 사용되는 이유는?
- 직렬화 : 객체를 텍스트 형태로 변환시켜 서버와 통신할 수 있게 해주는 역할을 함.
- 역직렬화 : 텍스트화 된 데이터를 브라우저나 서버에서 사용할 수 있도록 다시 객체화 해주는 역할을 함.
자바스크립트에서 직렬화/역직렬화 기술이 하나뿐인가? 다른 것이 있나?
- 목적과 성능에 따라 선택할 수 있는 다양한 기술 존재.
-
structuredClone()
자바스크립트 내장 알고리즘 사용
=> 특수 객체도 복사 가능 -
Protocol Buffers
데이터를 사람이 읽을 수 있는 글자가 아니라, 컴퓨터만 이해하는 이진법 사용
=> 대규모 시스템 통신에 유리 -
XML
태그(< >) 기반의 문서 형식
=> JSON 이전에 주로 사용했었음 -
MessagePack
JSON을 이진 형식으로 변환
=> 네트워크 비용 줄여야할때 사용
14

추유나
댓글
댓글을 작성하려면 이 필요합니다.