JavaScript 删除数组元素的四种常见方式详解

作者：代码拾荒时间：2026-10-26 09:58:29浏览：77

本文总结了JavaScript中删除数组元素的四种场景：删除末尾元素、删除首元素、删除指定值元素及删除指定索引元素。详细解析了slice、splice、pop、shift、filter及length属性等方法的用法与区别，并指出delete和forEach在特定场景下的局限性，帮助开发者选择合适方案。

方案一：移除末尾项目

使用 slice 方法

var arr = [1,2,3,4,5]
var new_arr = arr.slice(0, -1)
// arr => [1,2,3,4,5]
// new_arr => [1,2,3,4]
 
var arr = [1,2,3,4,5]
var new_arr = arr.slice(0, arr.length - 1)
// arr => [1,2,3,4,5]
// new_arr => [1,2,3,4]

使用 splice 方法

var arr = [1,2,3,4,5]
var new_arr = arr.splice(-1)
// arr => [1,2,3,4]
// new_arr => [5]
 
var arr = [1,2,3,4,5]
var new_arr = arr.splice(-1, 1)
// arr => [1,2,3,4]
// new_arr => [5]
 
var arr = [1,2,3,4,5]
var new_arr = arr.splice(arr.length - 1)
// arr => [1,2,3,4]
// new_arr => [5]
 
var arr = [1,2,3,4,5]
var new_arr = arr.splice(arr.length - 1, 1)
// arr => [1,2,3,4]
// new_arr => [5]

使用 pop 方法

var arr = [1,2,3,4,5]
arr.pop()
// arr => [1,2,3,4]

使用 for 循环

var arr = [1,2,3,4,5]
var new_arr = []
for (let i = 0, len = arr.length; i < len; i++) {
    if (i < len - 1) {
        new_arr.push(arr[i])
    }
}
// arr => [1,2,3,4,5]
// new_arr => [1,2,3,4]

修改 length 属性

var arr = [1,2,3,4,5]
arr.length = arr.length - 1
// arr => [1,2,3,4]

方案二：移除首部项目

使用 slice 方法

var arr = [1,2,3,4,5]
var new_arr = arr.slice(1)
// arr => [1,2,3,4,5]
// new_arr => [2,3,4,5]

使用 splice 方法

var arr = [1,2,3,4,5]
var new_arr = arr.splice(0, 1)
// arr => [2,3,4,5]
// new_arr => [1]

使用 shift 方法

var arr = [1,2,3,4,5]
arr.shift()
// arr => [2,3,4,5]

方案三：移除指定值元素

使用 filter 方法

var arr = [1,2,3,4,5],
    element = 2
 
arr = arr.filter(item => item != element)
// arr => [1,3,4,5]

使用 splice 方法

var element = 2,
    arr = [1,2,3,4,5]
 
arr.splice(arr.indexOf(2), 1)
// arr => [1,3,4,5]

使用 forEach、map 或 for 循环

var arr = [1,2,3,4,5],
    element = 2,
    new_arr = []
arr.forEach(item => (item != element && new_arr.push(item)))
// new_arr => [1,3,4,5]
 
// map 同理
 
var arr = [1,2,3,4,5],
    element = 2,
    new_arr = []
 
for (let i = 0; i < arr.length; i++) {
    arr[i] != element && new_arr.push(arr[i])
}
// new_arr => [1,3,4,5]

使用 Set 对象

var arr = [1,2,3,4,5],
    element = 2
var new_set = new Set(arr)
new_set.delete(element)
var new_arr = [...new_set]
// new_arr => [1,3,4,5]

方案四：移除指定索引元素

使用 splice 方法

var delete_index = 2
var arr = [1,2,3,4,5]
// arr => [1,2,3,4,5]
var new_arr = arr.splice(delete_index, 1)
// new_arr => [3]
// arr => [1,2,4,5]

使用 for 循环

var delete_index = 2,
    arr = [1,2,3,4,5],
    new_arr = []
 
for (let i = 0, len = arr.length; i < len; i++) {
    if (i != delete_index) {
        new_arr.push(arr[i])
    }
}
 
// arr => [1,2,3,4,5]
// new_arr => [1,2,4,5]

注意事项：

1. 禁止使用 delete 删除数组元素，这会导致稀疏数组，删除位置变为 empty，且数组长度保持不变。

2. 禁止使用 forEach 通过下标比对来删除元素，因为 forEach 的遍历顺序是无序的。

总结

本文介绍了JS中删除数组元素的四种方式，更多相关JS删除数组元素内容请查阅本站历史文章或继续浏览下文，感谢支持！

作者最新文章

JavaScript入门书籍避坑：这些书不适合初学者

2026-11-05 16:31:15

JS使用Math.round实现保留两位小数的原理与代码

2026-11-05 15:35:55

JavaScript 原生 Date 对象怎么实现日期加减

2026-11-05 14:30:00

JavaScript函数定义的三种方式：声明、表达式与箭头函数

2026-11-05 13:50:55

JavaScript中escape、encodeURI和encodeURIComponent对空格的处理差异

2026-11-05 12:47:23