Obtenir le premier élément du tableau en JavaScript

Shraddha Paghdar 12 octobre 2023
  1. Obtenir le premier élément du tableau à l’aide de find() en JavaScript
  2. Obtenir le premier élément du tableau à l’aide d’un array[index] en JavaScript
  3. Obtenir le premier élément du tableau à l’aide de shift() en JavaScript
  4. Obtenir le premier élément du tableau à l’aide de filter() en JavaScript
  5. Obtenir le premier élément de tableau à l’aide de l’affectation de déstructuration en JavaScript
Obtenir le premier élément du tableau en JavaScript

Les tableaux sont une partie essentielle de tout langage de programmation car ils contiennent de nombreux éléments de manière ordonnée. Tous ces éléments qu’ils contiennent sont accessibles via un index. En JavaScript, les tableaux sont des objets normaux qui contiennent la valeur de la clé spécifique, une clé numérique. Cet article présentera comment obtenir le premier élément d’un tableau en JavaScript.

JavaScript fournit diverses méthodes pour obtenir le premier élément. Apprenons ces méthodes.

Obtenir le premier élément du tableau à l’aide de find() en JavaScript

Il s’agit d’une méthode de tableau intégrée fournie par JavaScript, qui trouve les éléments dont la valeur correspond à la condition spécifiée.

Syntaxe de find() en JavaScript

Array.prototype.find(element => $condition)

Paramètres

  • $condition : C’est un paramètre obligatoire. L’utilisateur peut passer n’importe quelle condition liée à l’élément du tableau, et il essaiera de trouver le premier élément correspondant qui satisfait la condition.

Valeur de retour

Renvoie la première valeur qui correspond à une condition donnée. Si aucune condition ne correspond, il renverra undefined.

Exemple de code :

const arrayElements = [5, 10, 0, 20, 45];
const firstElement = arrayElements.find(element => element != undefined);
console.log(firstElement);

Production :

5

Obtenir le premier élément du tableau à l’aide d’un array[index] en JavaScript

Comme indiqué précédemment, chaque élément du tableau a un indice unique qui lui est attribué. La key/index numérique à l’intérieur d’un tableau commence par 0. En utilisant cet index, vous pouvez récupérer le premier élément d’un tableau en JavaScript.

Syntaxe de array[index] en JavaScript

Array.prototype[$index]

Paramètres

  • $index : C’est un paramètre obligatoire qui n’accepte que la valeur entière qui spécifie l’index de l’élément à récupérer.

Valeur de retour

Elle renvoie l’élément dont l’index est spécifié.

Exemple de code :

const arrayElements = [5, 10, 0, 20, 45];
const firstElement = arrayElements[0];
console.log(firstElement);

Production :

5

Obtenir le premier élément du tableau à l’aide de shift() en JavaScript

Il s’agit d’une méthode de tableau intégrée fournie par JavaScript, qui supprime le premier élément d’un tableau et renvoie l’élément supprimé. Le seul problème avec cette méthode de tableau est qu’elle mute/modifie le tableau d’origine.

Syntaxe de shift() en JavaScript

Array.prototype.shift()

Valeur de retour

Il renvoie le premier élément du tableau, qui est supprimé du tableau d’origine. Si un tableau est un tableau vide, il renverra undefined.

Exemple de code :

const arrayElements = [5, 10, 0, 20, 45];
const firstElement = arrayElements.shift(0);
console.log(firstElement);
console.log(arrayElements);

Production :

5
Array [10, 0, 20, 45]

Obtenir le premier élément du tableau à l’aide de filter() en JavaScript

Il s’agit d’une méthode de tableau intégrée à JavaScript qui filtre tous les éléments qui satisfont à la condition donnée. Il créera une copie du tableau des éléments correspondants. La seule différence entre find() et filter() est que le parcours arrête d’abord dès que le premier élément correspondant est trouvé, tandis que plus tard, il continuera jusqu’au dernier élément d’un tableau. Il est moins efficace si la taille d’un tableau est plus grande en raison de la propriété de traversée.

Syntaxe de filter() en JavaScript

Array.prototype.filter(element => $condition)

Paramètres

  • $condition : C’est un paramètre obligatoire. L’utilisateur peut passer n’importe quelle condition liée à l’élément du tableau, et il essaiera de trouver tous les éléments correspondants qui satisfont à la condition.

Valeur de retour

Renvoie le nouveau tableau contenant les éléments qui correspondent à une condition donnée.

Exemple de code :

const arrayElements = [5, 10, 0, 20, 45];
const firstElement =
    arrayElements.filter(element => element != undefined).shift();
console.log(firstElement);
console.log(arrayElements);

Production :

5
Array [5, 10, 0, 20, 45]

Obtenir le premier élément de tableau à l’aide de l’affectation de déstructuration en JavaScript

La destruction des affectations est une syntaxe très puissante disponible en JavaScript qui permet de décompresser les éléments d’un tableau ou les propriétés d’un objet à entrer dans des variables distinctes.

Syntaxe de l’affectation déstructurante en JavaScript

[$variable1, $variable2, ...$restVariables] = [10, 20, 30, 40];
{$variable1} = {key: value};

Valeur de retour

Il renvoie la nouvelle variable à travers laquelle vous pouvez accéder à la valeur d’un tableau ou d’un objet.

Exemple de code :

const arrayElements = [5, 10, 0, 20, 45];
let [firstElement] = arrayElements;
console.log(firstElement);

Production :

5
Shraddha Paghdar avatar Shraddha Paghdar avatar

Shraddha is a JavaScript nerd that utilises it for everything from experimenting to assisting individuals and businesses with day-to-day operations and business growth. She is a writer, chef, and computer programmer. As a senior MEAN/MERN stack developer and project manager with more than 4 years of experience in this sector, she now handles multiple projects. She has been producing technical writing for at least a year and a half. She enjoys coming up with fresh, innovative ideas.

LinkedIn

Article connexe - JavaScript Array