React - 상태의 불변성

React의 상태 불변성이 필요한 이유

• 페이지의 리렌더링
  리액트에서 페이지를 리렌더링을 하려면 대표적인 방법으로 상태값을 변경하는것에 있습니다.
  리액트에서 상태값 변경의 기준은
  state는 객체 형태이기 때문에, 객체의 메모리 데이터는 참조값을 저장하기 때문에 단순히 값만 변경할 경우
  참조값이 변하지않아 리렌더링이 되지않기 때문입니다.
  아무리 값을 변경할지라도 참조 값이 같다면 리액트에서는 리렌더링되지 않습니다.

• 사이드 이펙트 방지 및 프로그래밍 구조의 단순성
  원시타입은 애시당초 불변성 특징을 가지고 있지만 참조타입인 객체나 배열의 경우 값을 변경할 때 원본데이터가 변경될 여지가 있습니다. 이렇게 원본 데이터가 변경될 경우, 이 원본데이터를 참조하고 있는 다른 객체에서 예상치 못한 오류가 발생할 수 있습니다. 따라서 불변성을 지켜주면 사이드 이펙트를 방지하고 프로그래밍의 구조를 단순하게 유지할 수 있습니다.

불변성을 지키는 방법

불변성을 지키는 방법에는 여러가지 방법이 있습니다.
spread operator, map, filter, slice, reduce 등등 새로운 배열을 반환하는 메소드들을 사용하면 됩니다.

💡splice는 원본데이터를 변경함