How to remove an element from a key value array?

Question

I want to remove a specific element from an array, I am getting the key of the element from the input. I want to be able to remove the element only by knowing the key.

This is the array:

state ={
    splitAmount : [{
        "SplitAmount0": this.props.data.amount1
    }, {
        "SplitAmount1": this.props.data.amount2
    }, {
        "SplitAmount2": this.props.data.amount3
    }]
}

Remove function:

  removeSplitAmount(e) {
    console.log("remove",e.target.name)
    let array = [...this.state.splitAmount];
    let  index = this.state.splitAmount.IndexOf(p => p == e.target.name )
    if (index !== -1) {
        array.splice(index, 1);
        this.setState({splitAmount: array});
    }
}

Possible duplicate of How do I remove objects from a javascript associative array? — Erik Terwan
– Erik Terwan, Commented Jan 2, 2019 at 15:02

Chris · Accepted Answer · 2019-01-02 15:04:55Z

2

You can use the .filter method on the array combined with the Object.keys to clean the function up a lot:

removeSplitAmount(e) {
    const newSplitAmount = this.state.splitAmount
      .filter(p => !Object.keys(p).includes(e.target.name));

    this.setState({ splitAmount: newSplitAmount });
}

edited Jan 2, 2019 at 15:04

Chris

6,6911 gold badge25 silver badges27 bronze badges

answered Jan 2, 2019 at 15:03

dan

1,3749 silver badges25 bronze badges

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

1 Comment

Frank Over a year ago

Make sure to include a polyfill for the “includes” function if you need to support older browsers like IE11

Dmitry · Accepted Answer · 2019-01-02 15:15:01Z

1

You can use hasOwnProperty to filter objects you need.

removeSplitAmount(e) {
  const newSplitAmount = this.state.splitAmount
    .filter(x => !x.hasOwnProperty(e.target.name));

  this.setState({ splitAmount: newSplitAmount });
}

edited Jan 2, 2019 at 15:15

answered Jan 2, 2019 at 15:09

Dmitry

7,29614 gold badges42 silver badges42 bronze badges

1 Comment

Frank Over a year ago

I think this is the best answer even though the “newSplitAmount” variable is not even necessary and could be removed if you want even less code

Hugo Barragon · Accepted Answer · 2019-01-02 15:31:13Z

1

As Dmitry said you can't do a indexOf on an array of objects... i felt bad i didn't realize that. Would be useful on this case: var beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];

beasts.indexOf('bison')

On your case you are better to go with the .filter method as said in above answers because you are searching for and object with a specific property

edited Jan 2, 2019 at 15:31

answered Jan 2, 2019 at 15:02

Hugo Barragon

625 bronze badges

1 Comment

Dmitry Over a year ago

indexOf does not take lmbda as parameter. Unless you want to find an index of a lambda in an array of lambdas.

Collectives™ on Stack Overflow

How to remove an element from a key value array?

3 Answers 3

1 Comment

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related