HOWTO · JavaScript
Obtenir le premier élément du tableau en JavaScript
Dans cet article, nous allons apprendre comment obtenir le premier élément d'un tableau en JavaScript.
Sur cette page
Les tableaux JavaScript utilisent des indices qui commencent à zéro : array[0] lit donc le premier élément sans modifier le tableau. Pour trouver le premier élément qui satisfait une condition, utilisez find() ; utilisez shift() uniquement si vous souhaitez aussi supprimer le premier élément.
Obtenir le premier élément d’un tableau avec array[0] en JavaScript
La première position d’un tableau porte l’indice 0, la deuxième l’indice 1, et ainsi de suite. Cet exemple autonome lit le premier élément, puis affiche le tableau afin de montrer que le tableau d’origine reste inchangé.
const fruits = ["apple", "banana", "cherry"];
const firstFruit = fruits[0];
console.log(firstFruit);
console.log(fruits);
L’exemple affiche :
apple
[ 'apple', 'banana', 'cherry' ]
Si le tableau est vide, array[0] vaut undefined. Vérifiez donc qu’un élément existe si votre code dépend de cette valeur. Pour rechercher un élément selon une condition, utilisez la méthode find() du tableau au lieu de vérifier vous-même chaque élément.
Obtenir le premier élément d’un tableau par déstructuration en JavaScript
La déstructuration de tableau affecte le premier élément à une variable. Par exemple, const [firstFruit] = fruits; lit la même valeur que fruits[0] sans modifier fruits. Si le tableau est vide, firstFruit vaut undefined. Cette forme est utile lorsque l’affectation d’un ou de plusieurs premiers éléments à des variables rend le code environnant plus clair.
Utiliser find() pour obtenir le premier élément correspondant d’un tableau en JavaScript
Utilisez find() lorsqu’un prédicat définit l’élément recherché. La méthode parcourt les éléments dans l’ordre et renvoie le premier pour lequel le prédicat est évalué comme vrai. Si aucun élément ne correspond, le résultat est undefined ; tenez-en compte avant d’utiliser ce résultat.
Par exemple, const firstLongWord = words.find(word => word.length > 5); sélectionne le premier mot de plus de cinq caractères. Un simple array[0] convient mieux si vous voulez le premier élément, quelle que soit sa valeur. Consultez la référence JavaScript sur find pour les tableaux pour en savoir plus. Ce lien mène à la référence en anglais, car aucune version française n’est disponible.
Utiliser shift() pour obtenir et supprimer le premier élément d’un tableau en JavaScript
Appelez shift() sans argument pour récupérer et supprimer le premier élément. La méthode renvoie la valeur supprimée et modifie le tableau d’origine. Si le tableau est vide, elle renvoie undefined. Choisissez cette méthode uniquement si cette modification est voulue ; utilisez array[0] ou la déstructuration pour lire le premier élément sans changer le tableau.
Pourquoi filter() n’est généralement pas la meilleure méthode pour obtenir la première correspondance
filter() renvoie un nouveau tableau contenant tous les éléments qui satisfont son prédicat. La méthode poursuit le parcours pour réunir toutes les correspondances : elle effectue donc davantage de travail et crée un tableau alors qu’un seul résultat vous suffit. Pour obtenir la première correspondance, find() est plus clair : il renvoie directement l’élément et s’arrête dès qu’il l’a trouvé.
Vous pouvez lire le premier résultat d’une copie filtrée avec matches[0], mais cette copie est inutile pour une seule correspondance. Appeler shift() sur cette copie en retire un élément de la copie, sans toucher au tableau d’origine. Utilisez filter() lorsque vous avez réellement besoin de toutes les correspondances.
