인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

대섭님의 프로필 이미지
대섭

작성한 질문수

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

8.2) UI 구현하기

React에서 사용자 입력 처리하기 강의중 22:02쯤 spread연산자 관련 질문 입니다.

작성

·

346

0

setState()에서

setState({

author:e.target.value,

...state,

});

요 부분에서 spread연산자를 사용하면

setState({

author:e.target.value,

author: "",

content: "",

});

이런식으로 펼쳐지는 건가요?

setState는 새로운 객체를 만들어주는건데 저리 펼치면 author가 중복되는 부분 아닌가요?

답변 1

0

이정환 Winterlood님의 프로필 이미지
이정환 Winterlood
지식공유자

안녕하세요 이정환입니다.

강의중에 설명드린 것 과 같이 아래 두가지 방식은 차이가 존재합니다.

// 1번
{
  ...state,
  author : e.target.value
}
// 2번
{
  author : e.target.value,
  ...state
}

1번의 경우 state 객체의 정보를 먼저 펼쳐 준 다음에 author의 값만 따로 한번 더 e.target.value로 덮어 씌워주는 것이고

2번의 경우 author의 값을 e.target.value로 설정한 다음 state 객체의 정보를 펼치기 때문에, 결국 말씀하신대로 위에서 e.target.value로 설정한 author의 값은 state.author로 덮여씌워지게 됩니다.

 

대섭님의 프로필 이미지
대섭
질문자

감사합니다!!

대섭님의 프로필 이미지
대섭

작성한 질문수

질문하기