有人向我解释为什么我们从不直接在 Redux 中写入状态？

Question

我真的对 redux 中使用的 Object.assign() 感到困惑。

我不明白为什么下面的代码可以工作..

import { createStore } from "redux"

const userReducer = function (state={}, action) {
  switch (action.type) {
    case "CHANGE_USER_NAME":
      state.name = action.payload
      break;
    case "CHANGE_USER_AGE":
      state.age = action.payload
      break;
    default:
  }
  return state;
}

const store = createStore(userReducer)

store.subscribe(() => console.log(store.getState()))

store.dispatch({ type: "CHANGE_USER_NAME", payload: "paul" })
store.dispatch({ type: "CHANGE_USER_AGE", payload: 74 }) // It returned { name: "paul", age: 74 }
store.dispatch({ type: "CHANGE_USER_NAME", payload: "john" }) // It returned { name: "john", age: 74 } changed name to "john" but age is same. This point. is not immutable object?

我直接写state的值，但是结果是我期望的值...

user.name 已更改，但 user.age 未更改。

对我来说它看起来像是一个不可变的对象。我错了吗？

有人向我解释为什么我们从不直接写信给 state 吗？对不起我的虚拟问题。我在想原因，但我不知道为什么..

Answer 1

const userReducer = function (state={
  name : "",
  age : ""
}, action) {
  switch (action.type) {
    case "CHANGE_USER_NAME":
      state ={
        ...state ,
        name : action.payload
      }
      break;
    case "CHANGE_USER_AGE":
      state ={
        ...state ,
        age : action.payload
      }
      break;
    default:
  }
  return state;
}

这是在状态中存储数据的正确方法，这样它就不会覆盖以前的状态。

Answer 2

要理解为什么我们总是想要 return 一个新对象，您必须了解函数式编程中的纯函数和副作用。

纯函数将参数作为输入数据，将 return 数据或函数作为输出。这允许我们不改变输入，而是从输入中产生新数据。

这样原来的state会保持不变，取而代之的是一个全新的state对象，让你的函数保持纯净，不会产生副作用。

有人向我解释为什么我们从不直接在 Redux 中写入状态？

Somebody explain to me why we never write directly to state in Redux?

object

immutability

redux