Array.prototype.with() 是 ES2023 新增的不可变数组方法，用于简洁安全地替换指定索引处的单个元素，返回新数组，适用于 Redux 中更新列表项等场景。
Array.prototype.with() 是 ES2023 引入的原生数组方法，专为不可变地替换**单个元素**而设计。它不修改原数组，而是返回一个新数组，其中指定索引位置的值被替换为新值——这与 Redux 要求的不可变更新理念天然契合，尤其适合替代过去常见的 [...arr.slice(0, i), newValue, ...arr.slice(i + 1)] 或 arr.map((v, idx) => idx === i ? newValue : v) 等冗长写法。
直接替换数组中某一项（最典型场景）
在 Redux reducer 中更新列表某条数据（如待办事项完成状态、用户列表中某个用户的昵称）时，with() 可让逻辑一目了然：
- 传统写法需切片拼接或遍历映射，易出错且可读性差
- 使用
with()后，只需传入索引和新值，语义清晰，代码行数减半 - 注意：索引必须有效（
0 ≤ index ），越界时行为与 <code>at()类似（返回原数组）
配合 Redux Toolkit 的 createReducer 或 createSlice 使用
Redux Toolkit 鼓励“可变写法”（借助 Immer），但 with() 本身是纯函数，与 Immer 完全兼容，也可用于非 Immer 场景：
- 在
createSlice的reducers中，可直接对state.items调用.with(index, newItem) - 即使未启用 Immer（如手动编写 reducer），
with()返回的新数组也天然满足不可变要求，无需额外 clone - 示例：
state.todos = state.todos.with(action.payload.index, { ...state.todos[action.payload.index], completed: true });
不适用于批量更新或多位置替换
with() 每次仅替换一个元素，这是它的定位，也是优势——简单、专注、无副作用：
- 若需替换多个不同索引的项（如同时更新第 2 和第 5 条），仍需多次调用
with()，或改用map()+ 条件判断 - 若需插入、删除、移动元素，
with()无法胜任，应继续使用toSpliced()（ES2023）、toReversed()等配套新方法，或保持原有方案 - 不要强行用
with()模拟 splice：它不改变数组长度，也不支持负索引（负索引会被当作 0 处理）
浏览器兼容性与降级建议
目前（2024 年中）with() 已被 Chrome 117+、Firefox 119+、Safari 17.1+ 原生支持，但旧版浏览器或 Node.js 低版本不支持：
- 若需支持较老环境，可用简单 polyfill（基于 slice + 替换逻辑），但注意避免污染全局 Array 原型
- 在 Redux 中更推荐：将 polyfill 作为构建时依赖（如通过 core-js），或在关键路径做特性检测后分支处理
- TypeScript 用户需确保
lib配置包含es2023，否则类型报错
