자바 스크립트 - 불순한 기능 VS 순수

MuhammadUmarFarooq :

나는 두 등의 정의를 통과했다 :

순수 기능은 입력을 변경하려고, 항상 동일한 입력에 대해 동일한 결과를 반환하지 않는 사람입니다.

예

function sum(a, b) {
  return a + b;
}

그리고 불순한 함수는 자신의 입력을 변경 한 것입니다.

예

function withdraw(account, amount) {
  account.total -= amount;
}

ReactJs에서 가져온 정의와 코드 조각 공식 문서 .

이제 깡통 누군가가 내가 몇 가지 실수를 할 수있는 방법을 말해 반작용 / 돌아 오는 순수한 기능이 필요, 사용에 불순한 기능을?

Utsav 파텔 :

반응 Redux불변성과 함께 둘 필요가 순수 함수는 예측 가능한 방식으로 실행합니다.

이 두 가지를 따르지 않는 경우, 응용 프로그램은 가장 일반적인 존재, 버그를해야합니다 React/Redux변경 사항을 추적 할 때 재 렌더링 할 수없는없는 state/prop변화를.

반작용의 측면에서, 다음의 예를 고려하십시오

let state = {
    add: 0,
}

function render() {
    //...
}
//pure function
function effects(state,action) {
//following immutability while updating state, not directly mutating the state.
    if(action == 'addTen') {
        return {...state, add: state.add + 10} 
    }
    return state;
}

function shouldUpdate(s) {
    if(s === state){
        return false
    }
    return true
}

state = effects(state, 'addTen')if(shouldUpdate(state)) {
    render();
}

상태는 단지 추가 속성이 상태 객체에 의해 유지된다. 이 응용 프로그램은 응용 프로그램의 속성을 렌더링합니다. 어떤 일이 발생하지만, 변화가 상태 개체 발생 여부를 확인해야 할 때 항상 상태를 렌더링하지 않아야합니다.

그래서 마찬가지로, 우리는 이펙트 기능을 가지고 pure function우리가 우리의 상태에 영향을 사용합니다. 당신은 상태가 변경되어야하며, 어떠한 수정이 필요하지 않을 경우 같은 상태를 반환 할 때이 새로운 상태를 반환하는 것을 알 수있다.

우리는 또한이 shouldUpdate검사는 이전 상태와 새로운 상태가 동일인지 === 연산자를 사용하여 기능.

측면에서 실수 반응하려면, 당신은 실제로 다음을 수행 할 수 있습니다 :

function effects(state,action) {

  doRandom(); // effects should only be called for updating state.
             // Doing any other stuff here would make effects impure.

    if(action == 'addTen') {
        return {...state, add: state.add + 10}
    }
    return state;
}

당신은 직접 상태를 설정하고 사용하지 않음으로써 실수를 할 수있는 effects기능.

function doMistake(newValue) {
    this.state = newValue
}

위의 수행 만해서는 안 effects기능 상태를 업데이트하는 데 사용되어야한다.

반작용의 측면에서, 우리는 전화 effects로 setState.

돌아 오는 경우 :

돌아 오는의 combineReducers기준 변경에 대한 유틸리티를 확인합니다.
반응-돌아 오는의 connect방법은 루트 상태와의 리턴 값을 모두 검사 기준 변경하는 것이 구성 요소를 생성 mapState랩 된 구성 요소가 실제로 다시 렌더링 할 필요가있는 경우 기능을 볼 수 있습니다.
시간 여행 디버깅은 만회 할 필요 pure functions가 올바르게 다른 상태 사이를 이동할 수 있도록 부작용으로.

당신은 쉽게 감속기로 불순한 기능을 사용하여 세 가지 위를 침해 할 수 있습니다.

REDUX 워드 프로세서에서 직접 찍은 다음과 같은 :

당신이에 전달할 것 함수의 유형이기 때문에 그것은 감속기라고 Array.prototype.reduce(reducer, ?initialValue).
그것은 만회 순수한 유지하는 것이 매우 중요합니다. 당신이 감속기 내부하지 않을해야 할 것들 :

Mutate its arguments;
Perform side effects like API calls and routing transitions;
Call non-pure functions, e.g. Date.now() or Math.random().

같은 인수를 감안할 때, 그것은 다음 상태를 계산하고 그것을 반환해야합니다. 아니오 놀라움 없습니다. 어떤 부작용이 없습니다. 어떤 API 호출하지 않습니다. 어떤 돌연변이 없습니다. 그냥 계산.