基础笔记|splice()的用法

一、三种用法

• splice(index, 0, element) 插入 元素，不删除任何元素。
• splice(index, deleteCount) 删除 deleteCount 个元素。
• splice(index, deleteCount, element1, element2, ...) 替换 元素，即删除 deleteCount 个元素，同时插入新的元素。

二、插入元素的示例

(1) 在数组的某个位置插入一个元素

let arr = [1, 2, 3, 4, 5];

// 在索引 2 位置插入元素 10
arr.splice(2, 0, 10);

console.log(arr); // 输出: [1, 2, 10, 3, 4, 5]

解释：

• splice(2, 0, 10) 表示：
  • 在索引 2 的位置插入 10
  • 0 表示不删除任何元素
• 结果：10 被插入到 3 的前面。

(2) 在索引 2 处插入多个元素

let arr = [1, 2, 3, 4, 5];

// 在索引 2 位置插入 10, 20, 30
arr.splice(2, 0, 10, 20, 30);

console.log(arr); // 输出: [1, 2, 10, 20, 30, 3, 4, 5]

三、splice() 方法的特点

• 修改原数组：splice() 直接对原数组进行修改，而不是返回新数组。
• 可以插入多个元素：一次性插入多个值。
• 可以删除元素：如果 deleteCount > 0，则会删除指定数量的元素。
• 可以替换元素：如果 deleteCount > 0 且传入新元素，则会用新元素替换被删除的元素

四、结合 splice() 删除和替换元素

(1) 在索引 2 处删除 1 个元素

let arr = [1, 2, 3, 4, 5];

arr.splice(2, 1); // 删除索引 2 的元素，即 3

console.log(arr); // 输出: [1, 2, 4, 5]

(2) 在索引 2 处删除 1 个元素，并插入新元素

let arr = [1, 2, 3, 4, 5];

arr.splice(2, 1, 10, 20); // 删除索引 2 的 3，并插入 10 和 20

console.log(arr); // 输出: [1, 2, 10, 20, 4, 5]