Immutability

불변성이란 객체가 생성된 이후에 그 상태를 변경할 수 없는 디자인 패턴을 말한다

리액트에서 state는 항상 불변성을 유지해야한다고 얘기하는데

그렇기 때문에 state를 업데이트할 때는 state의 값을 직접 수정하는 것이 아닌 새로운 객체를 만든 뒤에 setState로 값을 새로 부여하는 업데이트하는 방식을 취하고 있다

리액트가 이러한 방식을 고집하는 이유는 아래에서 자세히 설명해주고 있다

의도하지 않은 특정 객체가 변경되면 참조하고 있던 객체에서도 변경이 일어난다. 이 상태를 유지할 경우 side-effect가 발생할 확률과 프로그램의 복잡도가 높아진다.
변경이 일어난 객체의 프로퍼티만 비교함으로써 React에서 최적화가 가능하다. (with shouldComponentUpdate)

불변성을 유지하기

es6를 기준으로 가장 많이 쓰이고 있는 방법은 아래와 같다

const obj3 = {
    id :1,
    text : 'abcde',
}
const obj4 = {
    ...obj3
}
console.log(obj3===obj4); // false;

다들 알고있겠지만 obj4 = obj3로 값을 초기화하면 같은 대상을 참조하기 때문에 제대로된 비교를 할 수가 없고 그렇게 되면 최적화 또한 불가능해진다