JavaScript 中怎么使用 Array.prototype.toSpliced 返回不修改原数组的拼接新数组-js教程-PHP中文网

Array.prototype.toSpliced 是 ES2023 新增的不可变数组方法，返回新数组：从 start 位置删 deleteCount 个元素后插入 items，原数组不变；语法为 arr.toSpliced(start, deleteCount, ...items)，支持负索引；兼容 Chrome 117+、Firefox 119+、Safari 17.1+。

javascript 中怎么使用 array.prototype.tospliced 返回不修改原数组的拼接新数组

Array.prototype.toSpliced 是 ES2023（ECMAScript 2023）新增的数组方法，它的作用是：**返回一个新数组，该数组在指定位置删除若干元素、再插入新元素，且不修改原数组**。它相当于 slice + splice 的安全、不可变版本。

toSpliced 的基本用法和参数

语法：arr.toSpliced(start, deleteCount, ...items)

start：开始删除的索引（支持负数，如 -1 表示倒数第一个）
deleteCount：要删除的元素个数；若为 0，则只插入不删除
...items：可选，要插入到 start 位置的新元素（零个或多个）

对比 splice 和 toSpliced：关键区别

splice() 会直接修改原数组并返回被删除的元素；而 toSpliced() 完全不改变原数组，只返回一个全新数组：

Java 接口排错助手

在调试 Java 后端 API 故障时使用此技能，尤其适用于以下任务：分析日志、跨 Controller、Service 和 Mapper 层追踪请求、定位异常根因、检查 SQL 执行或参数流转，以及生成简洁的诊断结论与修复方案。

下载

const arr = [1, 2, 3, 4, 5];
const newArr = arr.toSpliced(2, 1, 'a', 'b'); // 从索引 2 开始删 1 个，插入 'a','b'
console.log(newArr); // [1, 2, 'a', 'b', 4, 5]
console.log(arr);    // [1, 2, 3, 4, 5] ← 原数组不变

常见使用场景示例

在末尾添加元素（类似 concat）：arr.toSpliced(arr.length, 0, 'x', 'y')
替换中间某段（如第 2 个元素）：arr.toSpliced(1, 1, 'new')
删除某项而不影响原数组：arr.toSpliced(0, 1)（删首项）、arr.toSpliced(-1, 1)（删末项）
插入但不删除：arr.toSpliced(1, 0, 'before-2')（在索引 1 处插入）

浏览器兼容性与替代方案

目前（2024 年中），Chrome 117+、Firefox 119+、Safari 17.1+ 已支持 toSpliced；旧环境可用 polyfill 或手动实现：

// 简单 polyfill（仅基础功能）
if (!Array.prototype.toSpliced) {
  Array.prototype.toSpliced = function(start, deleteCount, ...items) {
    const arr = this;
    const len = arr.length;
    const actualStart = start return [
  ...arr.slice(0, actualStart),
  ...items,
  ...arr.slice(actualStart + actualDeleteCount)
];

}; }

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南