9. 객체 복사 문제점(!)

* 객체(object) 복사 문제점

- object의 값을 복사할 때는 대상 전체가 아니라, object 내 주소 값만 복사됨

- 가리키는 대상 전체를 복사하려면 얕은 복사(Shallow copy) 또는 깊은 복사(Deep copy) 방법 사용

 

* 얕은 복사(Shallow copy) 1

- for문을 이용한 복사 

// 궁금한 점 (궁금증이 해결될 때 까지만 남아있을 글)

for (let key in user) {
  user2[key] = user[key];
}

// 1. 아래 코드처럼 let이 빠지면 안되는 이유가 있을까?
for (key in user) {
  user2[key] = user[key];
}

// 2. 아래 코드는 왜 오류가 날까?
for (key in user) {
  user2.key = user.key;
}

// 일단 여기까지는 name과 age가 출력되니까 괜찮은데..
for (let key in user) {
  console.log(key);
}

// 이걸 돌리면 undefined undefined가 나온단 말이지.. 왜?
for (let key in user) {
  console.log(user.key);
}

 

 

* 얕은 복사(Shallow copy) 2

- Object.assign() 함수를 이용한 복사

 

* 얕은 복사(Shallow copy) 3

- ES6부터 지원하는 전개 연산자(Spread Operator)를 이용한 복사

- 신기해라.. 생전 처음 보는 연산자..

 

* 얕은 복사의 구조

 

* 얕은 복사의 문제점

- 객체 내 또 다른 객체가 있다면 그 또 다른 객체의 주소 값이 그대로 복사됨

- 객체 속에 객체 속에 객체를 더해서..

 

---

* 깊은 복사(Deep copy) 1

- 재귀 함수를 이용한 복사

 

* 깊은 복사(Deep copy) 2

- JSON 객체를 이용한 복사

- stringify는 객체를 문자열로 변환하는데, 이때 원본 객체와의 참조가 끊김

- 즉, 원본 객체와의 참조를 끊고, 이걸 복사!

 

* 깊은 복사의 구조