跳到主要内容

JavaScript 数组的 splice() 方法详解

splice() 方法用于修改数组(添加、删除或替换元素)。

示例

let prime_numbers = [2, 3, 5, 7, 9, 11];

// 在索引 4 处替换 1 个元素为 13
let removedElement = prime_numbers.splice(4, 1, 13);
console.log(removedElement);
console.log(prime_numbers);

// 输出: [ 9 ]
// [ 2, 3, 5, 7, 13, 11 ]

splice() 语法

splice() 方法的语法是:

arr.splice(start, deleteCount, item1, ..., itemN)

这里,arr 是一个数组。

splice() 参数

splice() 方法接受以下参数:

  • start - 从哪个索引开始更改数组。
  • deleteCount(可选)- 从 start 删除的元素数量。
  • item1, ..., itemN(可选)- 要添加到 start 索引的元素。如果未指定,splice() 将只从数组中删除元素。

splice() 返回值

  • 返回包含被删除元素的数组。

注意: splice() 方法会更改原始数组。

示例 1:使用 splice() 方法

let languages = ["JavaScript", "Python", "Java", "Lua"];

// 替换 "Java" 和 "Lua" 为 "C" 和 "C++"
let removed = languages.splice(2, 2, "C", "C++");
console.log(removed); // [ 'Java', 'Lua' ]
console.log(languages); // [ 'JavaScript', 'Python', 'C', 'C++' ]

// 添加元素而不删除现有元素
let removed1 = languages.splice(1, 0, "Java", "Lua");
console.log(removed1); // []
console.log(languages); // [ 'JavaScript', 'Java', 'Lua', 'Python', 'C', 'C++' ]

// 删除 3 个元素
let removed2 = languages.splice(2, 3);
console.log(removed2); // [ 'Lua', 'Python', 'C' ]
console.log(languages); // [ 'JavaScript', 'Java', 'C++' ]

输出

[ 'Java', 'Lua' ]
[ 'JavaScript', 'Python', 'C', 'C++' ]
[]
[ 'JavaScript', 'Java', 'Lua', 'Python', 'C', 'C++' ]
[ 'Lua', 'Python', 'C' ]
[ 'JavaScript', 'Java', 'C++' ]

示例 2:使用 splice() 处理不同的 deleteCount 值

  • 如果 start > array.lengthsplice() 不会删除任何内容,只会在数组末尾追加参数。
  • 如果 start < 0,索引从数组末尾开始倒数(array.length + start)。例如,-1 是最后一个元素。
  • 如果 array.length + start < 0,它将从索引 0 开始。
let languages = ["JavaScript", "Python", "Java", "Lua"];

// 不移除,仅在末尾追加
let removed = languages.splice(5, 2, "C++");
console.log(removed); // []
console.log(languages); // ["JavaScript", "Python", "Java", "Lua", "C++"]

// 移除最后一个元素并添加 3 个更多的元素
let removed1 = languages.splice(-1, 1, "Swift", "Scala", "Go");
console.log(removed1); // [ "C++" ]
console.log(languages); // ["JavaScript", "Python", "Java", "Lua", "Swift", "Scala", "Go"]

输出

[][("JavaScript", "Python", "Java", "Lua", "C++")]["C++"][
("JavaScript", "Python", "Java", "Lua", "Swift", "Scala", "Go")
];

示例 3:使用 splice() 处理不同的 start 值

  • 如果省略 deleteCount 或大于数组中剩余元素的数量,它会删除从 start 到数组末尾的所有元素。
  • 如果 deleteCount 是 0负数,则不会移除任何元素。但至少应指定一个新元素。
let languages = ["JavaScript", "Python", "Java", "Lua"];

// 从 start 开始移除所有元素
let removed = languages.splice(1);
console.log(removed); // [ "Python", "Java", "Lua" ]
console.log(languages); // [ "JavaScript" ]

// 不移除任何元素并添加 3 个更多的元素
let removed1 = languages.splice(1, -2, "Swift", "Scala", "Go");
console.log(removed1); // [ ]
console.log(languages); // [ "JavaScript", "Swift", "Scala", "Go" ]

输出

[ "Python", "Java", "Lua" ]
[ "JavaScript" ]
[ ]
["JavaScript", "Swift", "Scala", "Go"]

推荐阅读: