在redux数据或状态或两者中,哪个真正不变?

时间:2018-11-10 18:11:18

标签: reactjs redux

我总是读到redux中的状态是并且应该是不变的,而登录store.getState()会在分派特定操作后返回该状态,该状态可能表示修改后的数据。

这部分让我感到困惑,在这种情况下,我们如何才能认为状态是不变的,这里的状态是指原始数据或作为第一个参数传递给reducer的初始数据吗?

const reducer = (state = [], action) => {


}

这里的不可变状态是初始状态,是 数组还是获取后分派的数据???

我需要澄清这个令人困惑的部分?

2 个答案:

答案 0 :(得分:2)

redux状态本身不是不可变的,但是它由不可变的数据结构组成。说状态是不变的是不正确的。

不可更改的数据结构的全部意义是您永远都不会对其进行更改。在谈论数组时,变异意味着添加,移除或设置值(例如pushshiftsplice等)。因此,要更改值,必须始终创建一个新数组(而不是对现有数组进行突变)。

例如:

const reducer = (state = [], action) => {
    const addedValue = action.payload.addedValue;
    return [...state, addedValue];
}

不是

const reducer = (state = [], action) => {
    const addedValue = action.payload.addedValue;
    state.push(addedValue);
    return state;
}

从这个意义上说,先前状态和新状态(返回值)都是不可变数据结构。

为了解释注释中提到的时间漫游的概念,首先我们假设某个变量中存在一些redux状态:

let state = /* redux state */

每当触发一个动作,所有的reducer都会递归运行以创建一个新状态。 Redux的整个概念是这样表达的:

let oldState = state;
state = reducers(oldState, action);

时空漫游的概念意味着我们要做这样的事情:

const stateHistory = [];
stateHistory.push(state)
state = reducers(oldState, action);

这样,我们的stateHistory变量将包含完整的先前状态。要进行时间漫游,我们可以简单地:

state = stateHistory[index];

然后重新呈现。

但是,如果没有不变的数据结构,这将无法工作。不变的数据结构可确保历史中的所有状态都是独立的,并且对一个状态进行更改不会影响其余状态。

答案 1 :(得分:1)

  

我总是读到redux中的状态是并且应该是不变的,而   记录store.getState()将返回可能表示状态的状态   调度特定操作后修改数据。

这是真的。

  

这部分让我感到困惑,如何看待状态是不变的   在这种情况下,此处的状态是指原始数据还是初始数据   作为第一个参数传递给reducer的数据?

状态作为化简器的参数是指实际状态。如果是第一次调用reducer,则状态将使用默认值(在本例中为 [] )初始化。此功能称为Default parameters

  

这里的不可变状态是初始状态,它是一个空数组   或提取后分派的数据?

Redux需要将reducer编写为纯函数,以便状态修改由Redux专门处理。

有关更多信息,请参阅Reducer's documentation