详解JavaScript中.splice()的用法
更新时间：2025年10月11日 10:13:46 作者：摇滚侠
Array.prototype.splice()是JavaScript中用于在数组的指定位置添加或删除元素的方法,同时直接修改原数组,本文就来详细的介绍一下.splice()的用法小结,感兴趣的可以了解一下
JavaScript Array splice() 方法详解
Array.prototype.splice() 是 JavaScript 数组的核心方法，用于在指定位置添加/删除元素，并返回被删除的元素，同时直接修改原数组。其语法为：
array.splice(startIndex, deleteCount, item1, item2, ...)
参数说明：
startIndex：操作起始位置（索引从 0 开始）deleteCount：要删除的元素数量（若为 0 则不删除）item1, item2...：要添加的新元素（可选）
使用示例
1. 删除元素
let fruits = ['🍎', '🍌', '🍇', '🍊']; let removed = fruits.splice(1, 2); // 从索引1开始删除2个元素 console.log(fruits); // 输出: ['🍎', '🍊'] (原数组被修改) console.log(removed); // 输出: ['🍌', '🍇'] (返回被删除元素)
2. 添加元素
let colors = ['red', 'green', 'blue']; colors.splice(1, 0, 'yellow', 'purple'); // 在索引1处添加元素 console.log(colors); // 输出: ['red', 'yellow', 'purple', 'green', 'blue']
3. 替换元素
let numbers = [10, 20, 30, 40]; let replaced = numbers.splice(2, 1, 99); // 将索引2的元素替换为99 console.log(numbers); // 输出: [10, 20, 99, 40] console.log(replaced); // 输出: [30] (被替换的元素)
4. 删除末尾元素
let arr = [1, 2, 3, 4, 5]; arr.splice(-2, 1); // 倒数第2位开始删除1个元素 console.log(arr); // 输出: [1, 2, 3, 5]
关键特性
- 修改原数组：与
slice()不同，splice()直接改变原数组 - 负索引支持：
startIndex可为负数（从末尾倒数） - 返回被删除元素：始终返回数组（无删除时返回空数组）
- 高效操作：适合需要同时添加/删除的场景
⚠️ 注意：当 deleteCount 大于剩余元素数时，会删除从起始位置到末尾的所有元素。
与 slice() 对比
方法 | 修改原数组 | 返回内容 | 主要用途 |
splice() | ✅ | 被删除的元素 | 添加/删除元素 |
slice() | ❌ | 新数组（子数组） | 提取子数组 |
// 示例对比 let a = [1,2,3]; a.splice(0,1); // 返回 [1], a变为[2,3] let b = [1,2,3]; b.slice(0,1); // 返回 [1], b仍为[1,2,3]
到此这篇关于详解JavaScript中.splice()的用法的文章就介绍到这了,更多相关JavaScript .splice()内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了Javascript幻灯片播放功能实现过程解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-05-05
这篇文章主要介绍了js+html5实现canvas绘制简单矩形的方法,涉及html5图形绘制的基本技巧,需要的朋友可以参考下2015-06-06
我们在日常生活中无论是坐公交还是点餐,都会接触各种各样的小程序,下面这篇文章主要给大家介绍了关于小程序中权限设计的相关资料,文中通过图文介绍的非常详细,需要的朋友可以参考下2022-09-09
ZeroClipboard 是国外大神开发的一个用于剪贴板复制的 JS 插件，它是基于 Flash 来实现跨浏览器的复制功能的。当我们使用 ZeroClipboard 的时候，它会悄悄隐藏一个小小的 Flash 影片(swf)，不会对我们的用户界面造成影响。我们只需要借助它实现复制功能就行了。2016-03-03
这篇文章主要介绍了Bootstrap Validator 表单验证的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下2016-07-07
这篇文章主要介绍了JS 实现获取验证码 倒计时功能,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2018-10-10
在使用layui加载后端数据请求时,对数据选项框进行双击即可实现数据的输入编辑更改,本文结合示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧2023-12-12
这篇文章主要介绍了微信小程序链接传参并跳转新页面的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下2016-11-11
刚开始我以为是会跟平时使用onclick()一样，没想到最近在写javascript入门ppt的时候发现了，原来自己太自以为是了！看来还有很多javascript的细节没有掌握好啊2013-11-11
Ajax异步提交表单数据的说明及方法实例，需要的朋友可以参考一下2013-06-06
最新评论