JS 기술면접 4-4. 얕은 복사, 깊은 복사

강연주·2024년 11월 29일

🙋‍♀️ 기술면접

목록 보기
74/112

27. 얕은 복사, 깊은 복사 차이점 설명

  1. 얕은 복사 (Shallow Copy)
    얕은 복사는 1단계 깊이의 객체 속성들만 복사합니다.
    객체나 배열 안에 중첩된 객체(Nested Object)가 있으면, 중첩된 객체의 참조값만 복사됩니다. 따라서 원본 객체의 중첩된 객체가 변경되면 얕은 복사된 객체도 영향을 받습니다.

예시:

javascript
코드 복사
const original = { a: 1, b: { c: 2 } };

// 얕은 복사
const shallowCopy = Object.assign({}, original);
shallowCopy.b.c = 42;

console.log(original.b.c); // 42 -> 원본도 영향을 받음
console.log(shallowCopy.b.c); // 42

특징:
얕은 복사에서 1단계의 속성만 복사되고, 중첩된 객체는 원본과 동일한 참조값을 공유합니다.
자주 사용하는 얕은 복사 방법:
Object.assign({}, obj)
Spread operator: { ...obj }
Array.prototype.slice()
Array.prototype.concat()

  1. 깊은 복사 (Deep Copy)
    깊은 복사는 객체의 모든 중첩된 구조를 재귀적으로 복사하여 원본 객체와 독립적인 새 객체를 생성합니다.
    즉, 중첩된 객체와 배열까지도 완전히 새롭게 복사되므로, 원본 객체가 변경되어도 복사된 객체는 영향을 받지 않습니다.

예시:

javascript
코드 복사
const original = { a: 1, b: { c: 2 } };

// 깊은 복사
const deepCopy = JSON.parse(JSON.stringify(original));
deepCopy.b.c = 42;

console.log(original.b.c); // 2 -> 원본은 영향을 받지 않음
console.log(deepCopy.b.c); // 42

특징:
중첩된 객체까지 독립적으로 복사됩니다.

깊은 복사를 구현하는 방법:
JSON 방식: JSON.parse(JSON.stringify(obj) (단, 함수, undefined, Symbol은 복사되지 않음)
라이브러리 활용: Lodash의 _.cloneDeep 함수
수동 재귀 함수 작성: 복사 논리를 재귀적으로 구현

요약:
얕은 복사는 참조값 공유로 인해 중첩된 객체의 변경이 원본에도 영향을 미칩니다.
깊은 복사는 중첩된 객체까지 모두 복사하여 원본과 복사본이 독립적입니다.

profile
아무튼, 개발자

0개의 댓글