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
Libérer: 2024-12-23 20:10:11
original
293 Les gens l'ont consulté

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'}];
Copier après la connexion

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');
Copier après la connexion

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;
Copier après la connexion

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');
Copier après la connexion

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');
Copier après la connexion

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);
Copier après la connexion

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 de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal