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

Les tableaux sont l'une des structures de données courantes avec lesquelles vous interagirez en JavaScript. Lorsque vous supprimez 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 de tableau JavaScript, que ce soit au début, à la fin ou quelque part entre les deux.

1. Supprimer le premier élément d'un tableau

Pour supprimer le premier élément d'un tableau, utilisez la fonction intégrée de JavaScript changement() méthode. Cela fonctionne hors de la boîte en supprimant l'élément, puis en déplaçant 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 affecter l'élément supprimé à une autre variable et l'utiliser plus tard si vous le souhaitez.

Voici comment:

constante demoTableau = [1, 2, 3, 4, 5];
constante firstElement = demoArray.shift();
console.log (demoArray); // journaux [2, 3, 4, 5]
console.log (premierélément); // journaux 1

2. Supprimer le dernier élément d'un tableau

JavaScript a une fonction intégrée populaire() méthode pour supprimer le dernier élément d'un tableau. Comme le changement() méthode, populaire() renvoie l'élément supprimé du tableau.

constante demoTableau = [1, 2, 3, 4, 5];
constante lastElement = demoArray.pop();
console.log (demoArray); // journaux [1, 2, 3, 4]
console.log (dernierélément); // journaux 5

Shift et pop sont deux des plus courants Méthodes de tableau JavaScript, mais ils ne peuvent vous emmener que jusqu'à présent. Outre ces deux méthodes, il existe plusieurs méthodes qui vous donnent plus de précision sur les éléments que vous supprimez.

3. Utilisation de l'opérateur de suppression

Alternativement, vous pouvez utiliser JavaScript supprimer opérateur pour supprimer un élément de tableau donné à un index spécifique. Cependant, contrairement aux autres méthodes que nous avons examinées auparavant, il y a un hic.

Le supprimer L'opérateur supprime uniquement la valeur, laissant un tableau avec un espace vide à son index. Cependant, la longueur du tableau d'origine reste la même, même si vous supprimez le dernier élément.

constante demoTableau = [1, 2, 3, 4, 5];
supprimer demoTableau[2];
console.log (démoTableau[2]); // journaux indéfinis
console.log (demoArray.length); // journaux 5
console.log (demoArray); // journaux [1, 2, vide, 4, 5]

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

Vous pouvez également supprimer un élément de tableau spécifique par valeur. Il n'y a pas de méthode intégrée pour le faire, mais vous pouvez combiner deux méthodes existantes pour le faire: Indice de() et épissure().

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

constante demoTableau = [1, 2, 3, 4, 5];
constante targetElementIndex = demoArray.indexOf(4);
console.log (targetElementIndex); // journaux 3

La méthode indexOf renvoie l'index de la première occurrence de la valeur que vous fournissez, même si la valeur est présente plusieurs fois. S'il ne trouve aucun élément correspondant, indexOf renvoie -1.

Maintenant que vous avez l'index de l'élément cible, vous pouvez utiliser le épissure() méthode pour supprimer l'élément à cet index. 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 souhaitez supprimer.

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

demoArray.splice (targetElementIndex, 1);

Le épissure() La méthode renvoie un tableau des éléments supprimés et modifiera le tableau d'origine des éléments, tout comme changement() et populaire().

Si certaines de ces méthodes sont nouvelles pour vous, consultez notre feuille de triche JavaScript complète. Il contient toutes les méthodes de tableau à votre disposition, non seulement pour supprimer, mais pour d'autres opérations telles que l'ajout, la mise en boucle, l'inversion et le filtrage d'éléments.

Travaillez avec des tableaux JavaScript comme un pro

Savoir travailler avec des tableaux en JavaScript est essentiel pour tous les développeurs Web en raison de la fréquence à laquelle vous les rencontrerez.

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.