리액트 하다가 상태 바꿀 때 기존 객체를 직접 수정하지 말고 새로 만들어서 넣으라는 말을 계속 듣는데, 왜 그래야 하는지 근본 이유를 잘 모르겠어서요.
그냥 이렇게 값 바꾸면 편한데 말이죠.
const user = { name: "kim", age: 20 };
user.age = 21;
이러면 안 되고 아래처럼 스프레드로 새 객체를 만들라고 하더라고요.
const updated = { ...user, age: 21 };
결과적으로 age가 21이 되는 건 똑같은데 굳이 새 객체를 만드는 이유가 뭔가요? 메모리만 더 쓰는 거 아닌가 싶기도 하고요. 리액트가 바뀐 걸 감지하는 방식이랑 관련이 있다는 얘기는 들었는데 정확히는 모르겠어요.
그리고 Object.freeze라는 것도 있던데 이건 스프레드랑 뭐가 다른 건가요? freeze 걸면 아예 못 바꾸게 막는 거 같긴 한데, 중첩된 객체는 안쪽까지는 안 얼려진다는 말도 봐서 더 헷갈려요.
const obj = Object.freeze({ a: 1, nested: { b: 2 } });
obj.a = 99; // 안 바뀜
obj.nested.b = 99; // 이건 바뀐다고?
얕은 동결이라 그렇다는데 그럼 실무에서는 불변성을 어떻게 관리하는 게 보통인지 궁금합니다. 초보라 설명이 좀 장황해도 괜찮으니 알려주세요.