在 redux reducer 中克隆对象

Question

我最近学习了 React 和 Redux，就在我以为我掌握了它的窍门时，我就被挂断了。

在我的减速器中，我的印象是扩展运算符应该在不同的内存位置创建对象的新实例。但是，使用 === 比较对象返回 true，我认为这意味着对象是相同的实例。

const initState = {

    loadcases: {
        1: {
            isActive: false,
            profile: 'UB'
        },
        2: {
            isActive: true,
            profile: 'PFC'
        }
    }
}


const designInput = (state=initState, action={}) => {

    let newState = {...state}; //clone design input state
    console.log(newState.loadcases === state.loadcases)
    // Prints: TRUE ---- WHYYYYYYY????????????

    // goes on to modify newState before returning it. 
}

redux 记录器显示我以前的状态已经等于新状态，这让我认为这里直接干扰了存储。我已经阅读了一些 redux 文档和其他帖子，这些帖子让我相信我已经正确设置了其他所有内容。

我们也非常感谢任何能就这个问题向我提供更多教育的资源。

更新：

Jayce's answer 正是发生的事情。

SO post 概述了适合深度克隆的方法。对我来说，我可能想要存储日期和其他数据，所以我选择使用lodash cloneDeep method。

所以现在：console.log(cloneDeep(state) === state.loadcases); // false

Answer 1

您对扩展运算符创建新对象的假设是正确的，但是它不会对对象进行 deep 克隆。它将嵌套值的 references 复制到新对象，这就是打印它们相等的原因。

如果你想用嵌套值深度克隆一些你不能使用传播的东西，你必须使用另一种方法。您可以使用 lodash 之类的库，或者 JSON.parse(JSON.stringify(obj)) 之类的库，有多种选择，例如“Javascript 深度克隆对象”之类的 google