HomeAboutMeBlogGuest
© 2025 Sejin Cha. All rights reserved.
Built with Next.js, deployed on Vercel
🚀
개발 노트
/
🌆
React에서 State의 불변성
🌆

React에서 State의 불변성

 
React에서 State의 불변성을 지켜야 한다.
불변성을 지킨다는 것이란 어떤 값을 변경할 때 그 값을 직접적으로 변경하지 않고
새로운 값을 새로 만들어서 변경하는 것을 의미한다.
 
useState에서 setState는 얕은 비교를 통해 상태 변화를 감지한다.
즉 참조값이 동일하다면 객체(배열) 안의 요소가 바뀌어도 감지되지 않는다.
비교를 할 때 값들을 하나하나 비교하는 것은 너무 많은 연산을 요구한다.
React는 성능 최적화를 위해 이 방법을 사용한다.
 

참고 자료

React에서 useState 리렌더링 문제
시작하기에 앞서 이 글은 개발을 공부하며 새로 알게된 내용을 제 나름의 해석대로 정리한 글입니다. 잘못된 부분이 있다면 저의 올바른 지식향상을 위해 지적해주시기 바라겠습니다. 혹시 react를 사용해서 어플리케이션을 만드는데 useState를 사용해서 state값을 업데이트를 해줬는데도 리렌더링되지 않는 문제가 발생한다면 혹시 setState를 하는 부분에서 위의 코드와 같은 형태로 하지 않았는지 확인해보시기 바라겠습니다.
React에서 useState 리렌더링 문제
https://velog.io/@snurf198/React%EC%97%90%EC%84%9C-useState-%EB%A6%AC%EB%A0%8C%EB%8D%94%EB%A7%81-%EB%AC%B8%EC%A0%9C
React에서 useState 리렌더링 문제
🤔 React state 불변성
state는 동적으로 변경되는 값인데, 불변성을 유지해야 한다니.. 무슨 의미일까? 여기서 불변성은, 메모리 영역에서의 직접적인 변경을 하지 않고, 기존의 값을 수정하지 않으면서 새로운 값을 만들어내는 것을 의미한다. 기존 state의 불변성을 지켜주어야만, 리액트 컴포넌트에서 상태가 업데이트가 됐음을 감지 할 수 있고 이에 따라 필요한 리렌더링이 진행되기 때문이다.
🤔 React state 불변성
https://velog.io/@ellie12/React-state-%EB%B6%88%EB%B3%80%EC%84%B1
🤔 React state 불변성