Maison >interface Web >js tutoriel >Comment puis-je rechercher et extraire efficacement des données à partir d'un tableau d'objets JavaScript ?

Comment puis-je rechercher et extraire efficacement des données à partir d'un tableau d'objets JavaScript ?

Linda Hamilton
Linda Hamiltonoriginal
2024-12-23 20:10:11210parcourir

How Can I Efficiently Find and Extract Data from an Array of JavaScript Objects?

Recherche d'une valeur correspondante dans un tableau d'objets JavaScript

Les programmeurs JavaScript rencontrent souvent le besoin de rechercher une valeur spécifique dans un tableau d'objets . Cet article explique différentes méthodes pour accomplir cette tâche, en se concentrant sur les méthodes find(), findIndex(), filter() et map().

Exemple de tableau

Considérez le tableau suivant d'objets JavaScript :

myArray = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'},{'id':'67','foo':'baz'}];

Trouver un objet spécifique Objet

Pour récupérer l'objet avec un identifiant de 45, utilisez la méthode find() :

const matchingObject = myArray.find(x => x.id === '45');

Obtenir la valeur de la propriété

Si vous souhaitez récupérer la valeur de la propriété foo pour l'objet correspondant, utilisez dot notation :

const fooValue = matchingObject.foo;

Recherche de l'index d'un objet

Pour déterminer l'index de l'objet correspondant, utilisez la méthode findIndex() :

const matchingIndex = myArray.findIndex(x => x.id === '45');

Filtrer les objets correspondants

Pour créer un tableau contenant uniquement les objets correspondants objets, utilisez la méthode filter() :

const matchingObjects = myArray.filter(x => x.id === '45');

Mappage des valeurs correspondantes

Pour extraire un tableau des valeurs de propriété foo correspondantes, chaînez le filter() et Méthodes map() :

const fooValues = myArray.filter(x => x.id === '45').map(x => x.foo);

Compatibilité avec les navigateurs Remarque

Les fonctions fléchées et certaines méthodes de tableau, comme find(), ne sont pas prises en charge par les anciens navigateurs. Pensez à utiliser Babel avec le polyfill approprié pour plus de compatibilité.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn