shallow copy 얕은 복사

얕은 복사 Shallow copy - 객체는 메모리 주소 전달

• 자바스크립트에서는 복사할때 항상 얕은 복사가 이루어짐
• 복사가 되어도 배열에 들어있는 오브젝트(=객체)는 객체 메모리 주소이므로
• 오브젝트를 수정하면(=키의값 을 수정) 그 오브젝트가 저장되어진 모든 곳에서 수정됨

얕은 복사 예제

const pizza = { name: '🍕', price: 2, owner: { name: 'Ellie' } };
const ramen = { name: '🍜', price: 3 };
const sushi = { name: '🍣', price: 1 };

//객체가 들어간 배열 만듦
const store1 = [pizza, ramen];
//기존의 배열 복사(얕은복사)해서 새로운 배열 반환
const store2 = Array.from(store1);
console.log('store1', store1);
console.log('store2', store2);

/* store1 [
    { name: '🍕', price: 2, owner: { name: 'Ellie' } },
    { name: '🍜', price: 3 }
  ]
  store2 [
    { name: '🍕', price: 2, owner: { name: 'Ellie' } },
    { name: '🍜', price: 3 }
  ] */

//기존배열의 맨 뒤에 아이템 추가
store2.push(sushi);
console.log('store1', store1);
console.log('store2', store2);

/* store1 [
    { name: '🍕', price: 2, owner: { name: 'Ellie' } },
    { name: '🍜', price: 3 }
  ]
  store2 [
    { name: '🍕', price: 2, owner: { name: 'Ellie' } },
    { name: '🍜', price: 3 },
    { name: '🍣', price: 1 }
  ] */

//shallow copy,얕은복사임을 보여주는 예제
//오브젝트 안의 키의 값을 변경하면?
pizza.price = 4;
console.log('store1', store1);
console.log('store2', store2);

//store1,store2 다 price:4 변경됨~!!✨✨✨✨
/* store1 [
    { name: '🍕', price: 4, owner: { name: 'Ellie' } },
    { name: '🍜', price: 3 }
  ]
  store2 [
    { name: '🍕', price: 4, owner: { name: 'Ellie' } },
    { name: '🍜', price: 3 },
    { name: '🍣', price: 1 }
  ] */