JS对象数组删除指定元素|极客笔记

JS对象数组删除指定元素

在JavaScript中，对象数组是一种常见的数据结构，它由多个对象组成，每个对象都有不同的属性和值。有时候我们需要从对象数组中删除特定的元素，这可能涉及到查找并删除该元素，或者根据特定的条件删除元素。本文将详细介绍如何在JavaScript中操作对象数组，以删除指定的元素。

删除指定属性值相同的元素

有时候我们需要删除对象数组中某个属性值与给定值相同的元素。下面是一个示例数组students，其中包含了多个学生对象，我们需要删除age属性为20的学生：

let students = [
  { name: 'Alice', age: 18 },
  { name: 'Bob', age: 20 },
  { name: 'Charlie', age: 20 }
];

for (let i = 0; i < students.length; i++) {
  if (students[i].age === 20) {
    students.splice(i, 1);
    i--; // 删除元素后需要减少索引，否则会漏掉一个元素
  }
}

console.log(students);

运行结果为：

[
  { name: 'Alice', age: 18 }
]

以上代码通过遍历对象数组students，判断每个元素的age属性是否为20，如果是则使用splice方法删除该元素。需要注意的是，删除元素后需要将当前索引i减一，否则会漏掉一个元素。

根据条件删除元素

除了直接删除指定属性值的元素外，有时候我们需要根据更复杂的条件来删除元素。下面是一个示例数组people，其中包含了多个人员对象，我们需要删除age大于50且gender为male的人员：

let people = [
  { name: 'Alice', age: 55, gender: 'female' },
  { name: 'Bob', age: 60, gender: 'male' },
  { name: 'Charlie', age: 45, gender: 'male' },
  { name: 'David', age: 50, gender: 'female' }
];

let filteredPeople = people.filter(person => !(person.age > 50 && person.gender === 'male'));

console.log(filteredPeople);

运行结果为：

[
  { name: 'Alice', age: 55, gender: 'female' },
  { name: 'David', age: 50, gender: 'female' }
]

以上代码使用filter方法对数组people进行筛选，保留age不大于50或gender不为male的人员。被保留下来的人员将存储在filteredPeople数组中。

使用Lodash库进行操作

除了原生的JavaScript方法外，我们也可以使用第三方库如Lodash来简化对象数组的操作。Lodash提供了丰富的方法来处理数组，包括删除元素、筛选等功能。下面是一个使用Lodash删除指定属性值相同元素的示例：

const _ = require('lodash');

let students = [
  { name: 'Alice', age: 18 },
  { name: 'Bob', age: 20 },
  { name: 'Charlie', age: 20 }
];

let filteredStudents = _.reject(students, { age: 20 });

console.log(filteredStudents);

运行结果为：