React-tutorial 고급 : 불변성 - Immutability 개념 | JeromeBaek
Immutability, 변경 불가성
객체가 생성된 이후 그 상태를 변경할 수 없는 디자인 패턴.
함수형 프로그래밍의 핵심 원리.
ES6 불변 데이터 패턴(immutable data pattern)을 쉽게 구현할 수 있는 새로운 기능
1. 객체의 방어적 복사(defensive copy)
Object.assign
2. 불변객체화를 통한 객체 변경 방지
Object.freeze
React Immutability
- React 컴포넌트의 state를 변경해야 한다면 객체의 값을 직접적으로 수정하면 절대 안되고,
무조건setState()를 통해 state를 업데이트 해주어야 한다. - 의도하지 않은 객체의 변경이 발생하는 원인의 대다수는
레퍼런스를 참조한 다른 객체에서 객체를 변경하기 때문 setState()를 통하여 state 를 변경하지 않으면 component 가 re-rendering 이 되지 않는다.
📚 읽을 거리
React state가 불변이어야 하는 이유 | Medium
리액트의 불변성과 Immutable.js 사용하기
리액트의 불변함, 그리고 컴포넌트에서 Immutable.js 사용하기 | Velopert
불변성을 지키는 이유와 업데이트 최적화 | Velopert
