Rechercher des objets dans un tableau en JavaScript

Sahil Bhosale 12 octobre 2023
  1. Rechercher des objets dans un tableau à l’aide de forEach() en JavaScript
  2. Rechercher des objets dans un tableau à l’aide de la méthode find() en JavaScript
Rechercher des objets dans un tableau en JavaScript

En JavaScript, travailler et stocker des données dans une structure de données de tableau est assez courant. Une structure de données de tableau peut prendre différentes formes, telles que des nombres, des chaînes, un autre tableau en tant qu’élément ou des objets. Dans cet article, expliquons comment rechercher des objets dans un tableau et diverses valeurs présentes dans chaque objet individuel.

Ici, nous avons un tableau d’objets avec le nom arrayofObjects. À l’intérieur de chaque objet, il existe différentes valeurs représentées par une paire clé-valeur. Il existe 3 paires clé-valeur. Les clés sont name, profession et company. En utilisant ces clés, nous pourrons accéder aux valeurs respectives de chaque objet individuel.

var arrayofObjects = [
  {name: 'Adam', profession: 'Engineer', company: 'Google'},
  {name: 'Sam', profession: 'Manager', company: 'Amazon'},
  {name: 'Gerogia', profession: 'Designer', company: 'Netflix'},
  {name: 'Kate', profession: 'Engineer', company: 'Microscoft'},
  {name: 'James', profession: 'Sales', company: 'Amazon'},
];

Un tableau est représenté par des crochets [] alors que les objets sont représentés par des accolades {}.

Il existe plusieurs manières de rechercher des objets dans un tableau. Certains des moyens sont indiqués ci-dessous.

Rechercher des objets dans un tableau à l’aide de forEach() en JavaScript

La façon traditionnelle de trouver des objets dans un tableau consiste à utiliser une boucle forEach(). Avec cela, nous pouvons parcourir chaque élément présent à l’intérieur de la boucle for.

Tout d’abord, accédons à l’ensemble des objets en utilisant forEach() à partir du tableau. Plus tard, nous verrons comment accéder aux valeurs individuelles présentes à l’intérieur de l’objet. Pour imprimer l’intégralité de l’objet du tableau ci-dessus, vous pouvez utiliser une boucle forEach(). Cette boucle nous fournira deux choses : l’élément lui-même du tableau et l’index de l’élément. Pour cela, nous devons passer deux paramètres à forEach(). Dans ce cas, nous n’aurons besoin que des éléments et non de l’index, nous passerons donc un paramètre, object. Vous pouvez donner n’importe quel nom à ce paramètre.

// print name of the people who work at amazon
arrayofObjects.forEach(object => {
  console.log(object);
});

Comme la boucle forEach() bouclera sur chaque élément, cet élément sera stocké dans cette variable object. Maintenant, la variable object contiendra l’intégralité de l’objet du tableau. Si vous imprimez cette variable object à l’aide de la console, elle imprimera tous les objets présents dans le tableau.

Production:

Object { name: "Adam", profession: "Engineer", company: "Google" }
Object { name: "Sam", profession: "Manager", company: "Amazon" }
Object { name: "Gerogia", profession: "Designer", company: "Netflix" }
Object { name: "Kate", profession: "Engineer", company: "Microsoft" }
Object { name: "James", profession: "Sales", company: "Amazon" }

Nous avons tous les objets du tableau ; accédons aux valeurs internes de ces objets. Imprimons maintenant le nom des employés qui travaillent dans la société Amazon. Pour accéder à n’importe quelle clé de l’objet, nous pouvons utiliser un point après la variable object et spécifier la clé. Par exemple, pour accéder à la clé de l’entreprise, nous utiliserons object.company.

// print name of the people who work at amazon
arrayofObjects.forEach(object => {
  if (object.company === 'Amazon') {
    console.log('Amazon Employee:', object.name);
  }
});

En utilisant une instruction if, nous comparerons la valeur de la clé avec la chaîne Amazon et si cela correspond, nous entrerons à l’intérieur de l’instruction if. Après cela, nous imprimerons le nom des employés qui travaillent chez amazon en utilisant object.name comme indiqué ci-dessus. Cela nous donnera la sortie ci-dessous.

Production:

Amazon Employee: Sam
Amazon Employee: James

Comme seules deux personnes travaillent chez Amazon, nous obtenons Sam et James comme résultat.

De même, nous pouvons imprimer toutes les valeurs de tous les objets à l’aide des touches name, profession et company ci-dessous.

// print every details of a person
arrayofObjects.forEach(object => {
  console.log(
      object.name + ' is ' + object.profession + ' who works at ' +
      object.company);
});

Production:

Adam is Engineer who works at Google
Sam is Manager who works at Amazon
Georgia is a Designer who works at Netflix
Kate is Engineer who works at Microsoft
James is Sales who works at Amazon

Rechercher des objets dans un tableau à l’aide de la méthode find() en JavaScript

La méthode find() est une autre façon de rechercher des objets et leurs éléments à partir d’un tableau en JavaScript. Le find() est une méthode ES6. Cette méthode fonctionne de manière similaire à la boucle forEach(), et accéder aux éléments à l’intérieur de l’objet est similaire à ce que nous avons vu auparavant.

Remplacez forEach par find dans votre code, et vous serez prêt à partir. Le code ci-dessous imprimera également chaque objet du tableau.

arrayofObjects.find(object => {
  console.log(object);
});

Production:

Object { name: "Adam", profession: "Engineer", company: "Google" }
Object { name: "Sam", profession: "Manager", company: "Amazon" }
Object { name: "Gerogia", profession: "Designer", company: "Netflix" }
Object { name: "Kate", profession: "Engineer", company: "Microsoft" }
Object { name: "James", profession: "Sales", company: "Amazon" }

De même, nous pouvons également accéder à chaque valeur de l’objet du tableau en utilisant leurs clés respectives comme suit.

arrayofObjects.find(object => {
  console.log(
      object.name + ' is ' + object.profession + ' who works at ' +
      object.company);
});

Production:

Adam is Engineer who works at Google
Sam is Manager who works at Amazon
Georgia is Designer who works at Netflix
Kate is Engineer who works at Microsoft
James is Sales who works at Amazon
Sahil Bhosale avatar Sahil Bhosale avatar

Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.

LinkedIn

Article connexe - JavaScript Object

Article connexe - JavaScript Array