在 JavaScript 中,删除数组中内容为xxx的元素

假设要删除内容为aaa的元素。

在 JavaScript 中,有几种方法可以删除数组中内容为aaa的元素。以下是几种常用的方法:

方法1:使用 filter() 方法(推荐)

javascript 复制代码
let arr = ["aaa", "bbb", "ccc", "aaa", "ddd"];
arr = arr.filter(item => item !== "aaa");
console.log(arr); // ["bbb", "ccc", "ddd"]

方法2:使用 for 循环(从后往前遍历)

javascript 复制代码
let arr = ["aaa", "bbb", "ccc", "aaa", "ddd"];
for (let i = arr.length - 1; i >= 0; i--) {
    if (arr[i] === "aaa") {
        arr.splice(i, 1);
    }
}
console.log(arr); // ["bbb", "ccc", "ddd"]

方法3:使用 while 循环和 indexOf

javascript 复制代码
let arr = ["aaa", "bbb", "ccc", "aaa", "ddd"];
let index;
while ((index = arr.indexOf("aaa")) !== -1) {
    arr.splice(index, 1);
}
console.log(arr); // ["bbb", "ccc", "ddd"]

方法4:使用 reduce() 方法

javascript 复制代码
let arr = ["aaa", "bbb", "ccc", "aaa", "ddd"];
arr = arr.reduce((acc, current) => {
    if (current !== "aaa") {
        acc.push(current);
    }
    return acc;
}, []);
console.log(arr); // ["bbb", "ccc", "ddd"]

方法5:创建新数组(简单直接)

javascript 复制代码
let arr = ["aaa", "bbb", "ccc", "aaa", "ddd"];
let newArr = [];
for (let item of arr) {
    if (item !== "aaa") {
        newArr.push(item);
    }
}
console.log(newArr); // ["bbb", "ccc", "ddd"]

性能比较和建议

  • filter() 方法 是最简洁和易读的,适合大多数情况
  • 从后往前遍历 在使用 splice() 时性能更好,因为不会影响未遍历的索引
  • 如果数组很大,filter() 通常性能较好
  • 如果需要修改原数组而不是创建新数组,使用方法2或3

处理对象数组(如果需要)

如果数组包含对象,需要根据特定属性来删除:

javascript 复制代码
let arr = [
    {name: "aaa", id: 1},
    {name: "bbb", id: 2},
    {name: "aaa", id: 3}
];

// 删除 name 为 "aaa" 的对象
arr = arr.filter(item => item.name !== "aaa");
console.log(arr); // [{name: "bbb", id: 2}]

推荐使用 filter() 方法,因为它代码简洁、易读,且在大多数情况下性能良好。

相关推荐
云烟成雨TD21 小时前
Spring AI Alibaba 1.x 系列【6】ReactAgent 同步执行 & 流式执行
java·人工智能·spring
于慨21 小时前
Lambda 表达式、方法引用(Method Reference)语法
java·前端·servlet
石小石Orz21 小时前
油猴脚本实现生产环境加载本地qiankun子应用
前端·架构
swg32132121 小时前
Spring Boot 3.X Oauth2 认证服务与资源服务
java·spring boot·后端
从前慢丶21 小时前
前端交互规范(Web 端)
前端
gelald21 小时前
SpringBoot - 自动配置原理
java·spring boot·后端
@yanyu66621 小时前
07-引入element布局及spring boot完善后端
javascript·vue.js·spring boot
殷紫川21 小时前
深入理解 AQS:从架构到实现,解锁 Java 并发编程的核心密钥
java
一轮弯弯的明月21 小时前
贝尔数求集合划分方案总数
java·笔记·蓝桥杯·学习心得
CHU72903521 小时前
便捷约玩,沉浸推理:线上剧本杀APP功能版块设计详解
前端·小程序