JavaScript数组元素删除的7种核心方法与原理详解

作者：异步漫步时间：2026-10-31 09:36:05浏览：467

本文系统总结JavaScript中删除数组元素的七种常用方法，涵盖length属性、delete关键字、栈方法pop、队列方法shift、splice、迭代方法forEach与filter以及原型扩展。详细解析各方法的适用场景、参数说明及返回值差异，帮助开发者根据实际需求选择最高效的数组操作方案。

JavaScript数组元素删除的七大方法汇总

在JavaScript中，除Object外，Array类型极为常用。与其他语言不同，JS中的Array极其灵活。本文总结了Array删除元素的方法，大致分类如下：

1、length属性 2、delete关键字 3、栈方法 4、队列方法 5、操作方法 6、迭代方法 7、原型方法

下面对上述方法逐一举例解释。

一、length属性

JavaScript中Array的length属性非只读。通过设置该属性可从数组末尾移除或添加项，示例如下：

 var colors = ["red", "blue", "grey"];   //创建一个包含3个字符串的数组
 colors.length = 2;
 console.log(colors[2]);  //undefined

二、delete关键字

 var arr = [1, 2, 3, 4];
 delete arr[0];
 console.log(arr);   //[undefined, 2, 3, 4]

可见，delete删除后数组长度不变，被删元素变为undefined。

三、栈方法

 var colors = ["red", "blue", "grey"];
 var item = colors.pop();
 console.log(item);      //"grey"
 console.log(colors.length);    //2

调用Pop方法时，数组返回最后一项“grey”，元素仅剩两项。

四、队列方法

队列遵循FIFO（先进先出）规则，在列表末端添加项，从前端移除项。使用shift方法可移除第一项并返回，长度减1。

 var colors = ["red", "blue", "grey"];
 var item = colors.shift();
 console.log(item);      //"red"
 console.log(colors.length);    //2

五、操作方法

splice()是最强大的数组方法，此处仅介绍删除元素用法。它可删除任意数量项，需指定两个参数：起始位置和删除项数，如splice(0, 2)删除前两项。

 var colors = ["red", "blue", "grey"];
 var item = colors.splice(0, 1);
 console.log(item);      //"red"
 console.log(colors);    //["blue", "grey"]

六、迭代方法

迭代方法通过循环查找符合删除条件的项并删除，常用于对象数组，根据属性（如ID）删除。介绍两种方法：

第一种使用最常见的ForEach循环对比元素，找到后删除：

var colors = ["red", "blue", "grey"];
colors.forEach(function(item, index, arr) {
    if(item == "red") {
        arr.splice(index, 1);
    }
});

第二种使用循环中的filter方法：

 var colors = ["red", "blue", "grey"];
 colors = colors.filter(function(item) {
     return item != "red"
 });
 console.log(colors);    //["blue", "grey"]

代码简单，返回非“red”的项给colors（生成新数组），从而删除元素。

七、原型方法

通过在Array原型上添加方法实现删除：

Array.prototype.remove = function(dx) {
    if(isNaN(dx) || dx > this.length){
        return false;
    }
    for(var i = 0,n = 0;i < this.length; i++) {
        if(this[i] != this[dx]) {
            this[n++] = this[i];
        }
    }
    this.length -= 1;
};
var colors = ["red", "blue", "grey"];
colors.remove(1);　　console.log(colors); //["red", "grey"]

JavaScript删除数组中指定元素(5种方法)

JavaScript删除数组中指定元素

在JavaScript中，数组是存储多个元素的常见数据类型。有时需删除特定元素。本文介绍如何使用JavaScript删除指定元素。