[코플릿] 객체 - 다른 객체들의 속성 가져오기

코드스테이츠 과제 코드를 공부 목적으로 변형 해서 정리 하였습니다.

---

🍀문제 코드

---

✅ 문제

• 세개의 객체가 있다. 세개의 객체의 모든 속성을 첫번째 객체에 추가해야한다.

⛔ 주의 

• 추가하려는 속성이 중복되는 경우 우선 순위는 첫번째 > 두번째 > 세번째 이다. 
• 첫번째를 제외한 객체는 수정 되어서는 안된다.

💬 입출력 예시

  const snack1 = {
    jelly: 1,
    cookie: 2,
  };

  const snack2 = {
    cookie: 4,
    candy: 3,
  };

  const snack3 = {
    jelly: 4,
    candy: 2,
    fruit: 6,
  };
  
  //함수 실행 전
  console.log(snack1);
  console.log(snack2);
  console.log(snack3);

  Solution(snack1, snack2,snack3);

  //함수 실행 후
  console.log(snack1);
  console.log(snack2);
  console.log(snack3);

 

🍀해결 코드

---

function Solution(snack1, snack2,snack3){
//  1. snack2객체와 snack3객체를 모아줄 새 객체를 만든다. 키 중복시 snack2값이 우선이다.
//  2. 모아둔 객체와 snack1객첼르 합친다. 키 중복시 snack1값이 우선이다.
  let newSnack = {...snack2}; //얕은 복사로 snack2의 프로퍼티들을 newSnack 에 할당합니다
  for(let snack in snack3){
    //snack 은 snack3 의 키 를 반복합니다. jelly - candy - fruit
    if(!(snack in newSnack)){
      //만약 newSnack 키에 snack3의 키가 없다면 추가 합니다.
      newSnack[snack] = snack3[snack];
    }
  }
  //newSnack = {cookie: 4, candy: 3, jelly: 4, fruit: 6}

  for(let snack in newSnack){
    //snack 은 newSnack 의 키 를 반복합니다. cookie - candy - jelly - fruit
    if(!(snack in snack1)){
      //만약 snack1 키에 newSnack 키가 없다면 추가 합니다.
      snack1[snack] = newSnack[snack];
    }
  }
}
const snack1 = {
  jelly: 1,
  cookie: 2
};

const snack2 = {
  cookie: 4,
  candy: 3
};

const snack3 = {
  jelly: 4,
  candy: 2,
  fruit: 6
};
//함수 실행 전
console.log(snack1);  //{jelly: 1, cookie: 2}
console.log(snack2);  //{cookie: 4, candy: 3}
console.log(snack3);  //{jelly: 4, candy: 2, fruit: 6}

Solution(snack1, snack2,snack3);

//함수 실행 후
console.log(snack1);  //{jelly: 1, cookie: 2, candy: 3, fruit: 6}
console.log(snack2);  //{cookie: 4, candy: 3}
console.log(snack3);  //{jelly: 4, candy: 2, fruit: 6}

 

🦦잡담

---

let newSnack = {...snack2}; //얕은 복사로 snack2의 프로퍼티들을 newSnack 에 할당합니다

얕은 복사로 snack2를 가져오지 않고 let newSnack = snack2; 이렇게 했다면 snack2에 값이 변경되어 틀렸을 것이다.

얕은 복사 방법과 깊은 복사 방법에 대해 잘 알아야 할것 같다는 필요성이 느껴졌다!

 

🐾참고

---

https://www.daleseo.com/js-objects-clone/