JavaScript: a = Object.assign({}, a, {k: v}) 会变异 a 吗？

Question

我有一个对象作为键、值对存储在 url 中作为查询参数。该对象的键可能会更改，我想使用该对象中的每个键、值对来更新 redux 应用程序中 state 对象的键、值对。我需要以不改变 state 对象的方式这样做，并且我目前正在尝试如下实现此目标：

case 'LOAD_SEARCH_FROM_URL':
  let _state = Object.assign({}, state);
  const args = action.obj.substring(1).split('&');
  args.map((arg) => {
    const split = arg.split('=');
    _state = Object.assign({}, _state, {
      [split[0]]: JSON.parse( decodeURIComponent( split[1] ) )
    })
  })
  return _state;

这在简单测试中工作正常，但我想确保这实际上没有执行任何突变。如果其他人可以就此问题提供任何见解，我将不胜感激！

Answer 1

不，Object.assign 只会改变目标（第一个参数），在您的情况下是新创建的空对象。来源（所有后续参数）将不会被修改。

Answer 2

要非常小心，如果对象嵌套很深，则 Object assign mutate object。它写在文档中，所以你应该检查你的数据结构。

For deep cloning, we need to use other alternatives because Object.assign() copies property values. If the source value is a reference to an object, it only copies that reference value. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

如果你有像 {a: 0 , b: { c: 0}} 这样的嵌套状态，尝试这样的事情在更改后不会被 redux 检测到：

const mapStateToProps = state => {
  return {
    value: state[YOUR_REDUCER_NAME].a.b
  }
}
connect(mapStateToProps)(Component)

JavaScript: a = Object.assign({}, a, {k: v}) 会变异 a 吗？

JavaScript: Will a = Object.assign({}, a, {k: v}) mutate a?

javascript

reactjs

redux

side-effects

mutation