对 Redux 不变性的工作方式感到困惑答案

【问题标题】：Confusion with how Redux immutability works对 Redux 不变性的工作方式感到困惑
【发布时间】：2020-03-27 18:35:52
【问题描述】：

我在学习 Redux 时遇到了一些关于 reducer 如何更新状态的困惑。例如这里是代码：

const initialState = {
  counter: 0
};

const counterReducer = (state = initialState, action) => {
  if(action.type==="INCREASE"){
    return {
      counter: state.counter+1;
    }
  }
  return state;
};

问题是当这段代码 counter: state.counter+1; 运行时，它会在此处将计数器从 0 更改为 1

const initialState = {
  counter: 0
};

让我困惑的是，如果它不变地改变，那么如果运行这段代码，是什么使得之前的状态被记住：

  if(action.type==="INCREASE"){
    return {
      counter: state.counter+1;
    }

不止一次。希望你明白我的意思，如果不是请告诉我

【问题讨论】：

简短回答，不，它不会改变初始状态下initialState 和属性counter 的值。这是因为如果传递了正确的action.type，该函数将返回对return {...} 语句创建的新object 的引用。 developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
希望这能回答你的问题stackoverflow.com/questions/34958775/…
@wlh，想象一下在第一个按钮上单击“INCREASE”动作被调度并且在这里 state.counter+1;状态取自初始状态。那是对的吗？但是当您第二次单击该按钮时。 1的当前状态在哪里？
你的 reducer 需要传入 state。所以你必须确保每次都将 state 传递给 reducer。此外，之后您需要有一个存储状态的地方。这就是某种带有store 的Provider 发挥作用的地方。

标签： reactjs redux

【解决方案1】：

counterReducer 不需要访问之前的状态。

state.counter+1; 正在访问 state.counter 的当前值，而不是之前的值。
我希望我没有误解这个问题。

编辑问题 1：Khreshna, ok but where does current state come from?
如果你熟悉其他语言"10" + 1 将返回各种错误，说你不能用字符串和整数进行数学运算。但不是javascript。

JS 具有类型强制，这意味着它可以将类型转换为关于操作的另一种类型。
长话短说 JS 中的 "10" + 1 将返回 101（int 1 被转换为字符串）。
在null + 1 中将返回1。即使您从未为计数器设置值，这就是您获得值的方式

【讨论】：

Khreshna，好的，但当前状态来自哪里？
抱歉 Nikko 你误解了我的意思，我的意思是想象在第一个按钮上点击“INCREASE”动作被调度并且在这里 state.counter+1;状态取自初始状态。那是对的吗？但是当您第二次单击该按钮时。 1的当前状态在哪里？
你将当前状态作为参数传递给const counterReducer = (state = initialState, action) => {，所以它是从函数参数中获取的。