使用展开运算符处理Redux取出的对象时丢失属性值如何解决

JavaScript 对象展开运算符...的拷贝规则是仅读取目标对象自身的可枚举属性，原型链属性、不可枚举属性、类实例内部存储的私有属性都不会被识别。
你遇到的问题核心原因是：从Redux中取出的customerProduct不是普通JS纯对象（POJO），而是Parse SDK（或同类ORM框架）生成的类实例：

• 控制台、Redux DevTools展示的完整字段是工具对这类实例做了特殊序列化后的结果，实际这些业务字段并不直接挂载在实例的自身可枚举属性上
• 你展开后得到的id、_objCount、className才是这个实例本身的自有可枚举属性，所以仅这几个字段被拷贝到了新对象中

方案1：临时转成普通对象再操作 #

如果是Parse类实例，调用实例自带的toJSON()方法即可得到和控制台展示结构一致的纯对象，再进行展开操作：

const updatedCustomerProduct = {
  ...customerProduct.toJSON(),
  newValue: "abc"
};

如果你的Redux store使用了ImmutableJS存储数据，改为调用toJS()方法转换：

const updatedCustomerProduct = {
  ...customerProduct.toJS(),
  newValue: "abc"
};

方案2：从根源修正Redux存储逻辑 #

后续往Redux store存入数据前，先把类实例、Immutable结构统一转成普通POJO，避免后续取用时出现各种类型兼容问题：

// 数据存入Redux前的处理示例
const handleSaveProduct = (parseInstance) => {
  dispatch({
    type: 'UPDATE_CUSTOMER_PRODUCT',
    payload: parseInstance.toJSON() // 提前转成纯对象再存入
  })
}

内容的提问来源于stack exchange，提问作者Fer Toasted