Question

16

What is the cleanest way to remove an element from an immutable array in JS?

rated 0 times [ 18] [ 2] / answers: 1 / hits: 32322 / 7 Years ago, mon, october 30, 2017, 12:00:00

I need to remove an element from an array that is a state of a React Component. Which means that it is an immutable object.

Adding a element is easy using spread syntax.

    return {

        ...state,

        locations: [...state.locations, {}]

    };

Removing is a little more tricky. I need to use an intermediate object.

        var l = [...state.locations]

        l.splice(index, 1)

        return {

            ...state,

            locations: l

        }

It make the code more dirt and difficult to understand.

Is there an easier or less tricky to create a new array removing an element from it?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

aileent

Add To Favorites

Follow

Total Points: 556

Total Questions: 107

Total Answers: 101

Location: Croatia

Member since Fri, Sep 11, 2020

4 Years ago

aileent questions

1 Next.js, getStaticProps not working with component but does with page

Tue, Mar 1, 22, 00:00, 2 Years ago

1 Why am I getting Failed to load extension. Invalid value for 'content_security_policy'?

Fri, Apr 16, 21, 00:00, 3 Years ago

1 Laravel livewire model is not working when updating input field from javascript?

Sun, Nov 29, 20, 00:00, 4 Years ago

1 How to get Input field type as props in react typescript

Wed, Nov 11, 20, 00:00, 4 Years ago

1 React Native Render error missing semicolon

Fri, May 8, 20, 00:00, 4 Years ago

View All

answered 7 Years ago ryley · Accepted Answer

You can use a combination of spread and Array#slice:

const arr = ['a', 'b', 'c', 'd', 'e'];



const indexToRemove = 2; // the 'c'



const result = [...arr.slice(0, indexToRemove), ...arr.slice(indexToRemove + 1)];



console.log(result);

Another option is Array#filter:

const arr = ['a', 'b', 'c', 'd', 'e'];



const indexToRemove = 2; // the 'c'



const result = arr.filter((_, i) => i !== indexToRemove);



console.log(result);