Spread Operator 如何与 Redux Reducer 配合？常见写法有什么作用

1. 返回对象中 ...state 的实际作用 #

Redux 的核心规则之一是 reducer 必须返回一个全新的状态对象，不能直接修改原状态。
...state 的作用是将原状态对象中所有未被当前 action 要求更新的字段，全部浅拷贝到新返回的状态对象中，避免这些字段在状态更新时丢失。
移除这行代码没看到异常，本质是测试场景下原状态只有 data、isLoading、error 三个字段，在 return 里已经手动把这三个字段全写全了，表面上没有差异。但如果状态里还存储了比如搜索关键词、分页参数、筛选条件这类额外字段，移除 ...state 之后这些字段会直接从新状态里消失，造成分页失效、搜索条件丢失这类隐性 bug。

2. 为什么给 action.orderList 套 {...} 看起来没有效果 #

对象展开运算符 {...obj} 的本质是把原对象自身的可枚举属性，浅拷贝到一个全新的普通对象中。
觉得套了展开符没变化，大概率是因为 action.orderList 本身是数组结构——数组本质是带数字索引的特殊对象，对数组做 {...action.orderList} 会生成一个类数组对象，而非真正的数组，后续如果代码对这个值调用数组方法（map、filter 等）就会直接报错。之前测试没出问题只是因为渲染层刚好兼容了类数组的遍历，没触发类型错误而已，这种写法本身对列表类的字段是没有价值的。

3. data: {...state.data, ...action.orderList} 的写法含义与常见误用 #

写法本身的设计目的 #

这种写法的适用前提是 state.data 是一个以订单号/订单ID为 key 的键值对映射对象（比如结构为 { "ORD001": {订单详情}, "ORD002": {订单详情} }），而非数组形式的列表：

• 先展开 ...state.data：把旧状态里已经存储的所有订单记录，全部拷贝到新的 data 对象中
• 再展开 ...action.orderList：把 action 携带的订单数据，按相同的 key 匹配到新对象中——如果是已存在的 key，就用新值覆盖旧值；如果是新增的 key，就直接追加到对象里
  这种写法的设计目标是局部合并更新部分订单信息，比如拉取几个订单的最新状态时，不需要替换整个订单列表，只更新对应订单的字段即可，避免丢失其他已加载的订单数据。

搜索场景下“返回全部旧记录”的问题原因 #

这种写法从设计上就不适合“搜索后只保留匹配的记录”的场景：

• 如果需求是搜索后完全替换旧的订单列表，只返回匹配搜索条件的记录，不需要展开旧的 state.data，直接将 data 赋值为 action.orderList 即可
• 合并写法会把旧状态里所有的订单都保留下来，再把搜索到的记录合并进去，自然会出现旧记录没有被清空的问题

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