splice() 方法是 JavaScript 数组对象的内置方法。你可以使用它通过删除现有元素或将其替换为新元素来更改数组的内容。

此方法修改原始数组,并将删除的元素作为新数组返回。

在本教程中,你将学习如何使用 splice() 方法删除、添加或替换数组的元素。让我们首先从数组中删除元素。

如何使用 splice() 删除数组元素

例如,假设你有一个名为 months 的数组,在该数组中有一些日期名称,如下所示:

let months = ["January", "February", "Monday", "Tuesday"];
数组中含有月份和日期名称

你可以使用 splice() 方法从 months 数组中删除日期名称,并同时将其添加到新数组中:

let months = ["January", "February", "Monday", "Tuesday"];
let days = months.splice(2);

console.log(days); // ["Monday", "Tuesday"]
创建一个含有日期的数组

splice() 方法至少需要一个参数,该参数是 splice 操作开始的起始位置的索引。在上面的代码中,将数字 2 传递给该方法,这意味着 splice() 将开始从索引 2 开始删除元素。

你还可以通过传递第二个数字参数(即 removeCount)来定义要从数组中删除多少个元素。例如,要仅删除一个元素,可以像这样传递数字 1

let months = ["January", "February", "Monday", "Tuesday"];
let days = months.splice(2, 1);

console.log(days); // ["Monday"]
console.log(months); // ["January", "February", "Tuesday"]
仅从数组中删除一个元素

省略 removeCount 参数时,splice() 将删除从起始索引到数组结尾的所有元素。

如何使用 splice() 删除和添加数组元素

该方法还允许你在删除操作之后立即添加新元素。你只需要在删除计数之后将要添加的元素传递到数组即可。

完整语法如下:

Array.splice(start, removeCount, newItem, newItem, newItem, ...)

下面的示例显示了如何在将 “March”和 “April” 添加到 months 数组的同时删除 “Monday” 和 “Tuesday”:

let months = ["January", "February", "Monday", "Tuesday"];
let days = months.splice(2, 2, "March", "April");

console.log(days); // ["Monday", "Tuesday"]
console.log(months); // ["January", "February", "March", "April"]
使用 splice() 同时删除和新增数组元素

如何在不删除元素的情况下新增数组元素

最后,可以通过将数字 0 传递给 removeCount 参数来添加新元素而不删除任何元素。如果没有删除任何元素,则 splice() 方法将返回一个空数组。你可以选择是否将返回的空数组存储到变量。

以下示例显示了如何在 "February" 旁边添加新元素 "March",而不删除任何元素。 由于 splice() 方法返回一个空数组,因此你不需要存储返回的数组:

let months = ["January", "February", "Monday", "Tuesday"];
months.splice(2, 0, "March");

console.log(months); 
// ["January", "February", "March", "Monday", "Tuesday"]
调用 splice() 方法,不返回任何元素

小结

你已经学习了如何使用 splice() 方法,很棒!

当你需要删除数组或向数组中添加新元素时,通常使用 splice() 方法。在某些情况下,也可以使用它来分隔包含混合内容的数组,如上例所示。

当你从数组中删除 0 个元素时,该方法将简单地返回一个空数组。你可以将返回的数组分配给变量,也可以不这么操作。

谢谢你阅读本教程

如果你想了解有关 JavaScript 的更多信息,欢迎访问我的网站 sebhastian.com,我在那里发布了 100 多篇有关 JavaScript 编程的教程,涵盖字符串操作、日期操作、数组和对象方法、JavaScript 算法解决方案等等。

原文:JavaScript Splice – How to Use the .splice() JS Array Method,作者:Nathan Sebhastian