Comment compter les objets dans un tableau

Savoir comment parcourir rapidement un tableau et compter les objets est d'une simplicité trompeuse. La length()méthode vous indiquera le nombre total de valeurs dans le tableau, mais que se passe-t-il si vous ne voulez compter ces valeurs qu'en fonction de certaines conditions?

Par exemple, imaginez que vous avez un tableau comme celui-ci:

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ];

Et vous ne voulez compter que le nombre d'objets dont la valeur est statusdéfinie sur '0'.

Comme avec à peu près tout dans la programmation, il existe un certain nombre de façons de le faire. Nous allons passer en revue quelques-unes des méthodes courantes ci-dessous.

Utilisez une forboucle

Le moyen le plus simple serait probablement de déclarer une countervariable, de parcourir le tableau et d'itérer counteruniquement si statusest égal à '0':

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ]; let counter = 0; for (let i = 0; i < storage.length; i++) { if (storage[i].status === '0') counter++; } console.log(counter); // 6

Vous pouvez simplifier un peu cela en utilisant une for...ofboucle:

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ]; let counter = 0; for (const obj of storage) { if (obj.status === '0') counter++; } console.log(counter); // 6

De plus, vous pouvez créer une fonction pour faire la même chose si vous avez d'autres tableaux d'objets à compter conditionnellement:

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ]; function statusCounter(inputs) { let counter = 0; for (const input of inputs) { if (input.status === '0') counter += 1; } return counter; } statusCounter(storage); // 6

Utiliser des méthodes de tableau

JavaScript inclut un tas de méthodes utiles lorsque vous travaillez avec des tableaux. Chacun peut être enchaîné à un tableau et passé différents paramètres avec lesquels travailler tout en itérant dans les éléments du tableau.

Les deux que nous examinerons sont filter()et reduce().

filter()

C'est exactement ce que fait la méthode filter: elle parcourt chaque élément du tableau et filtre tous les éléments qui ne répondent pas aux conditions que vous fournissez. Il retourne ensuite un nouveau tableau avec tous les éléments qui ont retourné true en fonction de vos conditions.

Par exemple:

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ]; const count = storage.filter(function(item){ if (item.status === 0) { return true; } else { return false; } }); /* [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' } ] */

Maintenant que vous avez filtré l'objet avec status: '1', appelez simplement la length()méthode sur le nouveau tableau pour obtenir le nombre total d'objets avec status: '1':

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ]; const count = storage.filter(function(item){ if (item.status === 0) { return true; } else { return false; } }).length; // 6

Mais cela peut être beaucoup raccourci avec la syntaxe ES6:

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ]; const count = storage.filter(item => item.status === '0').length; // 6

reduce()

Pensez à la reduce()méthode comme à un couteau suisse - elle est extrêmement flexible et vous permet de prendre un tableau en entrée et de le transformer en à peu près n'importe quoi. Mieux encore, filter()cette méthode renvoie un nouveau tableau, laissant l'original inchangé.

Vous pouvez en savoir plus reduce()dans cet article.

Pour nos besoins, nous voulons prendre un tableau, examiner son contenu et produire un nombre. Voici un moyen simple de le faire:

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ]; const count = storage.reduce((counter, obj) => { if (obj.status === '0') counter += 1 return counter; }, 0); // 6

Vous pouvez simplifier davantage en utilisant la syntaxe ES6 et un opérateur ternaire:

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ]; const count = storage.reduce((counter, obj) => obj.status === '0' ? counter += 1 : counter, 0); // 6

Et même un peu plus en utilisant la déstructuration d'objets:

const storage = [ { data: '1', status: '0' }, { data: '2', status: '0' }, { data: '3', status: '0' }, { data: '4', status: '0' }, { data: '5', status: '0' }, { data: '6', status: '0' }, { data: '7', status: '1' }, ]; const count = storage.reduce((counter, { status }) => status === '0' ? counter += 1 : counter, 0); // 6

Voilà donc quelques façons de parcourir les éléments d'un tableau et de les compter conditionnellement. Maintenant, sortez et comptez en toute confiance!