본문 바로가기
JAVASCRIPT

자바스크립트(javascript) Object.assign() 객체복제

by 웨브개바르자 2023. 1. 23.

newUser와 user는 전혀  다른 객체이다.

메서드 1)  Object.assign() : 객체복제

객체 복제를 해보자.

 

const user = {

    name : 'Mike',

    age : 30;

}

 

const cloneUser = user; 

 

이렇게 하면 객체가 복사가 되나? 아니다.

객체의 주소만 복사됨.

예를 들어 0x100 주소에 name : 'mike' , age : 30이 할당되어 있는데

의도한 것은 0x200 이라는 새로운 주소에 새로운 객체가 생기는 것인데

그렇게 되지 않고 cloneUser 도 0x100 주소를 바라보게 되는 것.

그래서 user.name = 'james' 이렇게 이름 바꾸면 cloneUser.name도 'james'로 바뀜

 

그렇다면 어떻게 복제해야함?

 

1.

const newUser = Object.assign({}, user);

{  } 빈 객체 <- user 객체를 빈(empty) 객체에 넣어줘서 복제함  (정확히  이건 아닌데 걍 내가 이해한대로 적음)

{  } + { name : 'Mike' , age : 30 } =

  {

      name : 'Mike' , 

      age : 30

  }     

 

const newUser = Object.assign({}, user);

newUser.name = 'Tom';

console.log(user.name);  // 'Mike' 

객체 복제를 하면 newUser(0x200)와 user(0x100)는 서로 다른 주소를 가르키는 다른 객체임

 

2. 객체복제시 꼭 빈 객체 아닐수도 있다. 

const newUser2 = Object.assign({ gender:'male' }, user);

{ gender:'male' } + { name : 'Mike' , age : 30 } =

  {

      gender:'male',

      name : 'Mike' , 

      age : 30

  } 

 

3. 두 개 이상의 객체도 복제가능

const user = {

    name : 'Mike';

}

 

const info1 = {

    age : 33;

}

 

const info2 = {

    gender : 'male';

}

 

const newUser3 = Object.assign(user, info1, info2);

 

 

 

댓글