Quelle est la façon la plus propre de supprimer un élément d'un tableau immuable dans JS?

Question

J'ai besoin de supprimer un élément d'un tableau qui est un état d'un composant React. Ce qui signifie que c'est un objet immuable.

L'ajout d'un élément est facile à l'aide de la syntaxe répartie.

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

La suppression est un peu plus délicate. J'ai besoin d'utiliser un objet intermédiaire.

        var l = [...state.locations]
        l.splice(index, 1)
        return {
            ...state,
            locations: l
        }

Cela rend le code plus sale et difficile à comprendre.

Existe-t-il un moyen plus facile ou moins compliqué de créer un nouveau tableau en supprimant un élément de celui-ci?

Answer 1

Vous pouvez utiliser une combinaison de propagation et 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);

Une autre option est le filtre Array #:

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

const indexToRemove = 2; // the 'c'

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

console.log(result);