4 façons de supprimer un élément spécifique d’un tableau JavaScript

Les tableaux sont l’une des structures de données les plus courantes avec lesquelles vous interagirez en JavaScript. Lorsque vous retirez un élément d’un tableau, différentes méthodes sont à votre disposition. Tout dépend de l’endroit où se trouve l’élément que vous souhaitez supprimer et de la manière dont vous souhaitez l’identifier.

Découvrez les différentes façons de supprimer un élément d’un tableau JavaScript, que ce soit au début, à la fin ou entre les deux.

1. Retirer le premier élément d’un tableau

Pour supprimer le premier élément d’un tableau, utilisez la fonction intégrée JavaScript shift() intégrée à JavaScript. Elle fonctionne d’emblée en supprimant l’élément, puis en décalant les index de tous les éléments restants.

Après avoir supprimé l’élément, la méthode shift le renvoie. Cela signifie que vous pouvez assigner l’élément supprimé à une autre variable et l’utiliser plus tard si vous le souhaitez.

Voici comment procéder :

2. Retirer le dernier élément d’un tableau

JavaScript dispose d’une fonction intégrée pop() pour supprimer le dernier élément d’un tableau. Comme la méthode shift() est similaire à la méthode shift(), pop() renvoie l’élément retiré du tableau.

Shift et pop sont deux des méthodes JavaScript les plus courantes pour les tableaux, mais elles n’ont qu’une portée limitée. En dehors de ces deux méthodes, il en existe plusieurs qui vous permettent d’être plus précis sur les éléments que vous supprimez.

3. Utilisation de l’opérateur Delete

Vous pouvez également utiliser l’opérateur JavaScript d’effacement de JavaScript pour supprimer un élément de tableau donné à un index spécifique. Cependant, contrairement aux autres méthodes que nous avons examinées précédemment, il y a un piège.

L’opérateur delete ne supprime que la valeur, laissant un tableau avec un espace vide à son index. Cependant, la longueur du tableau original reste la même, même si vous supprimez le dernier élément.

4. Supprimer un élément de tableau par valeur

Vous pouvez également supprimer un élément spécifique du tableau par sa valeur. Il n’existe pas de méthode intégrée pour ce faire, mais vous pouvez combiner deux méthodes existantes : indexOf() et splice().

Ces deux fonctions vous permettront de supprimer un élément spécifique d’un tableau sans avoir d’index. Tout d’abord, commencez par trouver l’index de l’élément qui vous intéresse en utilisant indexOf():

La méthode indexOf renvoie l’indice de la première occurrence de la valeur que vous fournissez, même si la valeur est présente plus d’une fois. Si elle ne trouve aucun élément correspondant, indexOf renvoie -1.

Maintenant que vous avez l’indice de l’élément cible, vous pouvez utiliser la méthode splice() pour supprimer l’élément à cet indice. Tout ce que vous avez à faire est de passer l’index de l’élément cible comme premier argument, suivi du nombre d’éléments que vous voulez supprimer.

Pour ne supprimer qu’un seul élément, passez une valeur de 1 comme deuxième argument :

Les splice() renvoie un tableau des éléments supprimés et modifie le tableau d’éléments d’origine, comme dans la méthode shift() et pop().

Si certaines de ces méthodes vous sont inconnues, consultez notre feuille d’astuces JavaScript complète. Elle contient toutes les méthodes de tableau disponibles, non seulement pour supprimer, mais aussi pour d’autres opérations telles que l’ajout, le bouclage, l’inversion et le filtrage d’éléments.

Travailler avec les tableaux JavaScript comme un pro

Savoir travailler avec des tableaux en JavaScript est essentiel pour tous les développeurs web, car vous les rencontrerez fréquemment.

Les concepts clés à maîtriser sont toutes les méthodes intégrées à votre disposition qui peuvent vous aider à faire presque n’importe quoi lorsque vous travaillez avec des tableaux.

S’abonner à notre newsletter