toSpliced()是ES2023新增的原子性非变更数组方法，不修改原数组，一次性返回新数组，支持删除、插入、替换三类操作，语法简洁且语义清晰，天然适配不可变更新场景。
toSpliced() 是 ES2023 引入的原生方法，它**不修改原数组，而是返回一个新数组**，同时支持删除、插入、替换三类操作——这天然满足“非变更”要求；而它的执行是单次调用、内部一次性计算并构造结果，因此具备逻辑上的原子性：不会出现中间态，也不会被其他代码打断。
什么是“原子性”的非变更修改？
指一次操作要么完整生效（返回预期新数组），要么完全不发生（原数组始终不变），不存在部分修改、竞态或可观察的中间状态。与 splice()（会改原数组、分步执行）或手写 [...arr.slice(0, i), ...newItems, ...arr.slice(i + delCount)]（多步切片拼接，若出错可能留半截）相比，toSpliced() 由引擎保障行为封闭、不可中断。
基础用法：统一接口替代手动切片拼接
它接受三个参数：start（起始索引）、deleteCount（删除个数）、后续为要插入的元素：
-
删除第2项（索引1）：
[1,2,3,4].toSpliced(1, 1)→[1,3,4] -
在索引2后插入两个值：
[1,2,3].toSpliced(3, 0, 'a', 'b')→[1,2,3,'a','b'] -
替换第1项（删1插1）：
[1,2,3].toSpliced(0, 1, 'x')→['x',2,3]
组合操作一步到位，避免多步中间态
传统方式想“删两项、再在开头加一个”，需多次 slice + concat，易出错且语义割裂；toSpliced() 可一气呵成：
-
删索引1–2（两项），并在开头插入 'first'：
[1,2,3,4,5].toSpliced(1, 2, 'first', 1)→[1,'first',1,4,5]（注意：插入内容从 start 位置开始填入） -
等价于手写但更安全：
[...'first', 1, ...[1,2,3,4,5].slice(0,1), ...[1,2,3,4,5].slice(3)]—— 冗长且索引易错
配合不可变更新场景（如 React、Redux）直接使用
无需封装工具函数，可直接用于状态更新逻辑中，清晰表达意图：
-
列表项删除（按索引）：
setItems(prev => prev.toSpliced(index, 1)) -
拖拽排序后更新（移除旧位置、插入新位置）：
items.toSpliced(oldIndex, 1).toSpliced(newIndex, 0, movedItem)（两次调用仍各自原子，如需单次原子移动，需计算偏移后合并为一次toSpliced） -
注意边界：负索引、超出长度的
start会被自动归约（类似slice），deleteCount超出剩余长度时只删到末尾
