Find and remove first matching element in an array of Javascript objects

Question

Suppose I have an array:

    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'}]

I'm looking for something for myRemoveByClass. ES2015 is fine or using Lodash. The array will have been ordered already. None of the questions I've seen quite match what I'm looking for.

The posted question does not appear to include any attempt at all to solve the problem. StackOverflow expects you to try to solve your own problem first, as your attempts help us to better understand what you want. Please edit the question to show what you've tried, so as to illustrate a specific roadblock you're running into a minimal reproducible example. For more information, please see How to Ask and take the tour. — CertainPerformance
– CertainPerformance, Commented Nov 29, 2018 at 8:34
Could you point to where it says we need to show what kind of attempt was made. Should I put the number of hours I spend on the problem or link to all the SO solutions that didn't address the question I asked. Such as stackoverflow.com/questions/25726066/… stackoverflow.com/questions/10457264/… stackoverflow.com/questions/35136306/… etc. Putting my efforts here would not clarify the question. — Gazzer
– Gazzer, Commented Nov 29, 2018 at 9:08
Putting my efforts here would not clarify the question. It would help illustrate that this isn't a no-effort homework dump or write-my-code-for-me-from-scratch question, which are frowned on - see the first two links in my comment above. Searching existing questions for code that does what you want isn't the same thing as trying to write code yourself — CertainPerformance
– CertainPerformance, Commented Nov 29, 2018 at 10:11
@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 that the whole point of reputation? isn't the same thing as trying to write code yourself Why do you assume that I didn't spend a couple of hours trying to code it myself which I did, and finding my code was not helpful in framing the question? — Gazzer
– Gazzer, Commented Nov 29, 2018 at 11:07

Mamun · Accepted Answer · 2023-04-03 09:32:38Z

18

You can use Array.prototype.findIndex():

The findIndex() method returns the index of the first element in the array that satisfies the provided testing function. Otherwise, it returns -1, indicating no element passed the test.

Then splice() the object by that index.

let members = [
        {name: 'Anna', class: 'one'}, 
        {name: 'Bob', class: 'two'},  
        {name: 'Chuck', class: 'two'}];
let idx = members.findIndex(p => p.class=="two");
if(idx >= 0){ //check if item found
  var removed = members.splice(idx, 1);     
  console.log(removed);
  console.log(members);
}
else{ //or not
  console.log('Not found!');
}

edited Apr 3, 2023 at 9:32

answered Nov 29, 2018 at 8:43

Mamun

69k9 gold badges51 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Max Over a year ago

This is dangerously wrong - if no element is found, idx will be -1, and then members.splice(idx, 1) will remove the last element of members, which is not what you want in that case...

Jonas Wilms · Accepted Answer · 2018-11-29 08:34:39Z

7

You could create your own Array class:

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

Use it as

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

PS: "class" is a very bad name as it is a reserved keyword

answered Nov 29, 2018 at 8:34

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

1 Comment

Gazzer Over a year ago

I was going to change it, but ESLint didn't seemed to mind class there so I left it in! I don't want to edit it now so that the solutions match the question!

Teun van der Wijst · Accepted Answer · 2018-11-29 08:36:05Z

1

This would also work

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');

answered Nov 29, 2018 at 8:36

Teun van der Wijst

1,1271 gold badge10 silver badges24 bronze badges

Comments

Nina Scholz · Accepted Answer · 2018-11-29 08:37:07Z

1

You could find the index of the first occurence and check this index and splice the object from the array.

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; }

answered Nov 29, 2018 at 8:37

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Comments

Yosvel Quintero · Accepted Answer · 2024-05-13 09:33:42Z

1

You can use create an Array.prototype.removeByProp to remove first element found by prop equal to value using Array.prototype.find() and Array.prototype.splice()

Code example:

// removeByProp
Array.prototype.removeByProp = function (prop, value) {
  const index = this.findIndex((o, i) => o?.[prop] === value)
  if (index !== -1) {
    this.splice(index, 1)
  }
  return this
}

const members = [{ name: 'Anna', class: 'one' }, { name: 'Bob', class: 'two' }, { name: 'Chuck', class: 'two' }]
const result = members.removeByProp('class', 'two')

console.log(result)

edited May 13, 2024 at 9:33

answered Nov 29, 2018 at 8:50

Yosvel Quintero

19.1k5 gold badges39 silver badges47 bronze badges

Comments

Oliver · Accepted Answer · 2018-11-29 08:37:14Z

0

Simply:

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

answered Nov 29, 2018 at 8:37

Oliver

5402 gold badges8 silver badges18 bronze badges

Comments

im_tsm · Accepted Answer · 2018-11-29 08:48:29Z

0

You could use some method to find the member which needs to be removed and return true to stop the loop.

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);

As Jonas pointed out here, you should avoid using class as it is a reserved word.

answered Nov 29, 2018 at 8:48

im_tsm

2,05120 silver badges30 bronze badges

Comments

Schüler · Accepted Answer · 2018-11-29 09:14:44Z

0

you can use without and findWhere

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

answered Nov 29, 2018 at 9:14

Schüler

5424 gold badges11 silver badges26 bronze badges

1 Comment

Moshe Over a year ago

does this require lodash? seems like it's lodash syntax

Collectives™ on Stack Overflow

Find and remove first matching element in an array of Javascript objects

8 Answers 8

1 Comment

1 Comment

Comments

Comments

Comments

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

8 Answers 8

1 Comment

1 Comment

Comments

Comments

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related