在 Javascript 对象数组中查找并删除第一个匹配元素答案

【问题标题】：Find and remove first matching element in an array of Javascript objects在 Javascript 对象数组中查找并删除第一个匹配元素
【发布时间】：2019-05-01 06:18:05
【问题描述】：

假设我有一个数组：

    members = [
        {name: 'Anna', class: 'one'}, 
        {name: 'Bob', class: 'two'},  
        {name: 'Chuck', class: 'two'}];

    removed = members.myRemoveByClass('two');     //something like

    // removed is {name: 'Bob', class: 'two'} 
    // members is [{name: 'Anna', class: 'one'}, {name: 'Chuck', class: 'two'}]

我正在为myRemoveByClass 寻找东西。 ES2015 很好，或者使用 Lodash。该阵列将已经订购。 None 的questions 我已经seen 相当match 我是looking 的。

【问题讨论】：

发布的问题似乎根本没有包含any attempt 来解决问题。 StackOverflow 期待您try to solve your own problem first，因为您的尝试有助于我们更好地了解您想要什么。请编辑问题以显示您尝试过的内容，以说明您遇到minimal reproducible example 的特定障碍。欲了解更多信息，请参阅How to Ask 并拨打tour。
您能否指出它说我们需要展示进行了何种尝试的地方。我应该把我花在这个问题上的小时数或链接到所有没有解决我提出的问题的 SO 解决方案。比如stackoverflow.com/questions/25726066/…stackoverflow.com/questions/10457264/…stackoverflow.com/questions/35136306/…等。把我的努力放在这里不会澄清问题。
Putting my efforts here would not clarify the question. 这将有助于说明这不是一个不费吹灰之力的家庭作业转储或 write-my-code-for-me-from-scratch 问题，这是不受欢迎的 - 见第一个我上面的评论中有两个链接。在现有问题中搜索可以满足您需求的代码与尝试自己编写代码不同
@CertainPerformance It would help illustrate that this isn't a no-effort homework dump or write-my-code-for-me-from-scratch question 这不是声誉的全部意义吗？ isn't the same thing as trying to write code yourself 为什么你认为我没有像我自己那样花几个小时尝试自己编写代码，并且发现我的代码对提出问题没有帮助？

标签： javascript arrays

【解决方案1】：

您可以将Array.prototype.find() 与Array.prototype.splice() 结合使用

代码示例：

const members = [{ name: 'Anna', class: 'one' }, { name: 'Bob', class: 'two' }, { name: 'Chuck', class: 'two' }];

members.find((o, i) => {
  if (o.class === 'two') {
    members.splice(i, 1); // Find and remove first matching element
    return true;
  }
  return false;
});

console.log(members);

【讨论】：

【解决方案2】：

您可以使用without 和findWhere

var arr = _.without(members , _.findWhere(members , {
 class: "two"
}));

【讨论】：

这需要lodash吗？好像是 lodash 语法

【解决方案3】：

您可以使用some方法找到需要删除的member并返回true以停止循环。

let members = [
  {name: 'Anna', class: 'one'}, 
  {name: 'Bob', class: 'two'},  
  {name: 'Chuck', class: 'two'}
];

function myRemoveByClass(members, className) {
  let foundMember = null;
  members.some((member, index) => {
    if (member.class == className) {
      members.splice(index, 1);
      foundMember = member;
      return true;
    }
  });
  
  return foundMember;
}

let removed = myRemoveByClass(members, 'two');
console.log(removed);
console.log(members);

正如 Jonas 指出的 here，您应该避免使用 class，因为它是一个保留字。

【讨论】：

【解决方案4】：

你可以使用Array.prototype.findIndex():

findIndex() 方法返回数组中满足所提供的测试功能的第一个元素的索引。否则返回-1，表示没有元素通过测试。

然后splice()那个索引的对象。

var members = [
        {name: 'Anna', class: 'one'}, 
        {name: 'Bob', class: 'two'},  
        {name: 'Chuck', class: 'two'}];
var idx = members.findIndex(p => p.class=="two");
var removed = members.splice(idx,1);     
console.log(removed);
console.log(members);

【讨论】：

【解决方案5】：

简单地说：

function removeByClass(obj, prop) {
    for (let i = 0; i < obj.length; i++) {
        if (obj[i].class == prop) obj.splice(i, 1);
    }   
}

【讨论】：

【解决方案6】：

您可以找到第一次出现的索引并检查该索引并从数组中拼接对象。

var members = [{ name: 'Anna', class: 'one' }, { name: 'Bob', class: 'two' }, { name: 'Chuck', class: 'two' }],
    index = members.findIndex(o => o.class === 'two'),
    removed = index !== -1 && members.splice(index, 1);

console.log(removed);
console.log(members);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：

【解决方案7】：

这也可以

removeByClass(array, filterString) {
   const memberToRemove = array.find(element => {
     return element.class === filterString;
   });
   array.splice(array.indexOf(memberToRemove), 1);
 }

 let members = [
  { name: 'Anna', class: 'one' },
  { name: 'Bob', class: 'two' },
  { name: 'Chuck', class: 'two' }];

this.removeByClass(members, 'two');

【讨论】：

【解决方案8】：

您可以创建自己的 Array 类：

 class Members extends Array {
   removeByClass(className) {
     for(const [index, member] of this.entries())
        if(member.class === className) 
           return this.splice(index, 1)[0];
   }
}

把它当做

 const members = new Members([ {/*...*/}, {/*...*/} ]);
 members.removeByClass("...");

PS：“类”是一个非常糟糕的名字，因为它是一个保留关键字

【讨论】：

我打算改变它，但 ESLint 似乎并不介意class 所以我把它留在了！我现在不想编辑它，以便解决方案与问题匹配！