[JS] Object.assign과 spread operator의 차이점

강의를 듣따가 궁금한 점이 생겼따.

 

1. Object.assign을 사용

handleCreate = data => {
    const { information } = this.state;
    this.setState({
      information: information.concat(
        Object.assign({}, data, {
          id: this.id++
      )
    });
  };

2. spread operator 사용 (...) 

handleCreate = data => {
    const { information } = this.state;
    this.setState({
      information: information.concat({
        …data,
        id: this.id++
      })
    });
  };

두개가 똑같다고 하는데 분명 머가 다른점이 있을 것 같았당. (똑같으면 코드가 두개일리 없지 후훗 합리적 의심)

 

그래서 코딩천재 친구한테 물어봤따 (분명 까먹을꺼기 때문에 나중에 또 보려고 글씀... 호홋)

Object.assign은 첫 번째 인자로 들어간 객체를 조작하고, spread operator는 새 객체를 반환한다고 했당.

 

흠, , , 무슨뜻이냐면

Object.assign(a, 어쩌구) 하면 a 자체가 변한다는 것!!!! a 변수 자체에 조작을 가하게 된다.

하지만 { ...a, 어쩌구 } 를 하게되면 a 와 어쩌구가 합쳐진 새로운 객체를 만든다. a 자체는 여전히 원래의 값을 유지한 다는 것!

후후 신기방기. 이런 차이점이 있었다.

 

참고해본 사이트

 

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

Object.assign()

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Spread_syntax

전개 구문