왜 Redx의 오브젝트는 불변이어야 합니까?

왜 Redx의 오브젝트는 불변이어야 합니까?

왜 Redx의 오브젝트는 불변이어야 합니까?Angular2와 같은 일부 프레임워크는 onPush를 사용하고 있으며, 보다 빠른 렌더링을 위해 뷰 상태를 비교하는 데 불변성을 이용할 수 있다는 것은 알고 있지만, Redux는 프레임워크에 의존하지 않고 자신의 문서 내에서 불변성을 사용하도록 언급하고 있기 때문에 다른 이유가 있는지 궁금합니다.

피드백 감사합니다.

Redx는 상태를 (불변의) 개체로 나타내는 작은 라이브러리입니다.또한 순수한 함수를 통해 현재 상태를 전달하여 완전히 새로운 객체/애플리케이션 상태를 생성함으로써 새로운 상태를 만듭니다.

저쪽에서 눈을 부릅뜨고 있어도 걱정하지 마세요.요약하자면, Redx는 객체 지향 패러다임과 같이 객체를 수정하여 애플리케이션 상태의 변화를 나타내지 않습니다.대신 상태 변화는 입력 개체와 출력 개체 간의 차이로 나타납니다().var output = reducer(input))의 어느쪽인가를 변환했을 경우,input또는output상태를 무효로 합니다.

요약하자면, Redx는 애플리케이션 상태를 "Frozen Object Snapshot"으로 나타내기 때문에 불변성은 Redx의 요건입니다.이러한 개별 스냅샷을 사용하면 상태를 저장하거나 상태를 반전시킬 수 있으며, 일반적으로 모든 상태 변경에 대한 "계정" 기능이 향상됩니다.

앱의 상태는 리듀서라고 하는 순수한 기능의 카테고리에 의해서만 변경됩니다.리듀서에는 다음 2가지 중요한 특성이 있습니다.

1. 변환하지 않고 새로 빌드된 개체를 반환합니다.이를 통해 부작용 없이 입력 + 출력에 대해 추론할 수 있습니다.
2. 그들의 서명은 항상 function name(state, action) {}를 사용하면 다음과 같이 쉽게 구성할 수 있습니다.

상태가 다음과 같이 되어 있다고 가정합니다.

    var theState = {
      _2ndLevel: {
        count: 0
      }
    }

숫자를 늘리고 싶어서 이 감소기들을 만들어서

const INCR_2ND_LEVEL_COUNT = 'incr2NdLevelCount';

function _2ndlevel (state, action) {
    switch (action.type) {
        case INCR_2ND_LEVEL_COUNT:
            var newState = Objectd.assign({}, state);
            newState.count++
            return newState;
        }
    }

function topLevel (state, action) {
    switch (action.type) {
        case INCR_2ND_LEVEL_COUNT:
            return Object.assign(
                {}, 
                {_2ndLevel: _2ndlevel(state._2ndlevel, action)}
            );
    }
}

의 사용에 주의해 주세요.Object.assign({}, ...)각 리듀서에 완전히 새로운 개체를 만듭니다.

Redux를 이러한 Reduce에 연결했다고 가정하면 Redux의 이벤트 시스템을 사용하여 상태 변경을 트리거하면...

    dispatch({type: INCR_2ND_LEVEL_COUNT})

...Redux는 다음과 같이 문의합니다.

    theNewState = topLevel(theState, action);

주의:action에서 왔다dispatch()

지금이다theNewState완전히 새로운 객체입니다.

주의: 라이브러리(또는 새로운 언어 기능)를 사용하여 불변성을 적용하거나 아무것도 변환하지 않도록 주의할 수 있습니다.d

자세한 내용은 Dan Abramov(작성자)의 비디오를 확인해 보시기 바랍니다.궁금한 점이 있으면 대답해 줄 겁니다.

Redux 문서에는 불변성의 다음과 같은 이점이 기재되어 있습니다.

• 리덕스 리액트 리덕스★★★★
  • Redux의 combineReducers 유틸리티는 호출하는 리듀서에 의한 참조 변경을 얄팍하게 체크합니다.
  • React-Redux의 연결 메서드는 루트 상태에 대한 참조 변경과 mapStateToProps로부터의 반환 값을 얄팍하게 체크하는 컴포넌트를 생성하여 랩된 컴포넌트를 실제로 다시 렌더링해야 하는지 여부를 확인합니다.이러한 얄팍한 체크는 올바르게 기능하기 위해 불변성이 필요합니다.
• 불변의 데이터 관리는 궁극적으로 데이터 처리를 더욱 안전하게 합니다.
• 시간 이동 디버깅에서는 리듀서가 부작용이 없는 순수한 함수여야 하므로 다른 상태 간에 올바르게 이동할 수 있습니다.

Redux가 불변성을 사용하는 주된 이유는 모든 키 값의 변화를 확인하기 위해 오브젝트 트리를 통과할 필요가 없기 때문입니다.대신 상태 변경 시 DOM을 업데이트하기 위해 객체의 참조가 변경되었는지 여부만 확인합니다.

기사 https://medium.cobeisfresh.com/how-redux-can-make-you-a-better-developer-30a094d5e3ec 를 참조해 주세요.

불변의 데이터와 함께, 순수한 함수는 함수 프로그래밍의 핵심 개념 중 하나이다.

공식 문서에 근거합니다.

Redx에서 상태를 변환하지 않아야 하는 몇 가지 이유가 있습니다.

• UI가 올바르게 업데이트되지 않는 등의 버그가 발생하여 최신 값이 표시됩니다.
• 상태가 갱신된 이유와 방법을 이해하기 어렵게 됩니다.
• 시험을 쓰는 것이 더 어려워진다.
• "시간 여행 디버깅"을 올바르게 사용할 수 없게 됩니다.
• 이는 Redux의 의도된 정신과 사용 패턴에 위배됩니다.

Reudx 공식 문서

언급URL : https://stackoverflow.com/questions/34958775/why-should-objects-in-redux-be-immutable