浅拷贝重置状态需基于原始默认值的新副本，避免引用污染；推荐用{...initialState}、[...initialState]或Object.assign；深层嵌套需扁平化设计或深拷贝。
在 JavaScript 中，浅拷贝用于状态重置时快速恢复初始默认 state，关键在于：每次重置都应基于原始默认值的**一份新副本**，而非引用原对象，避免后续修改污染默认状态。
为什么不能直接赋值初始 state？
如果初始 state 是一个对象或数组，直接 state = initialState（尤其在 React 类组件或某些状态管理中）——而 initialState 是一个对象字面量或变量引用，多次重置时若该对象被修改过，就会导致“默认值变脏”。例如：
const initialState = { user: { name: 'Alice' }, list: [] };
let state = initialState; // ❌ 引用同一对象
state.user.name = 'Bob';
state.list.push(1);
// 再次 state = initialState → 仍指向已被改过的对象！
推荐的浅拷贝方式（适用多数场景）
对顶层属性为基本类型、对象/数组仅需一层复制的结构，用以下方法即可安全重置：
-
对象用
{...initialState}—— 最简洁，支持嵌套一层对象，但内层对象仍是引用 -
数组用
[...initialState]—— 同理，只拷贝第一层元素 -
Object.assign({}, initialState)—— 兼容性更好，适合需要支持旧环境的项目 -
函数封装一次，复用更安全：
const getFreshState = () => ({ ...initialState });
重置时调用setState(getFreshState())，确保每次都是全新对象
注意边界：浅拷贝不解决深层嵌套问题
如果 initialState 包含多层嵌套对象（如 { config: { theme: { color: 'blue' } } }），浅拷贝后修改 state.config.theme.color 仍会影响下一次重置。此时有两种选择：
Java 接口排错助手
下载
在调试 Java 后端 API 故障时使用此技能，尤其适用于以下任务：分析日志、跨 Controller、Service 和 Mapper 层追踪请求、定位异常根因、检查 SQL 执行或参数流转，以及生成简洁的诊断结论与修复方案。
立即学习“Java免费学习笔记（深入）”；
-
保持结构扁平：设计 state 尽量避免深层嵌套，把
theme提到顶层，用浅拷贝即可覆盖 -
需要深拷贝时再升级：仅当真实存在深层可变结构且频繁修改时，才考虑
JSON.parse(JSON.stringify(initialState))（注意 Date、Function、undefined 等会丢失）或structuredClone（现代浏览器支持）
React 函数组件中的典型用法
结合 useState 和初始化函数，天然规避引用问题：
const MyComponent = () => {
const initialState = { count: 0, items: [], isActive: false };
const [state, setState] = useState(() => ({ ...initialState }));
const reset = () => setState({ ...initialState }); // ✅ 每次新建对象
// 或更稳妥：setState(() => ({ ...initialState }));
};
使用函数式初始化 + 函数式 setState，既清晰又无副作用。
