Saber cómo iterar rápidamente a través de una matriz y contar objetos es engañosamente simple. El length()método le dirá el número total de valores en la matriz, pero ¿qué sucede si solo desea contar esos valores en función de ciertas condiciones?
Por ejemplo, imagina que tienes una matriz como esta:
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' }, ];Y solo desea contar el número de objetos con statusestablecido en '0'.
Al igual que con casi todo en programación, hay varias formas de hacer esto. Veremos algunos de los métodos comunes a continuación.
Usa un forbucle
Probablemente, la forma más fácil sería declarar una countervariable, recorrer la matriz e iterar countersolo si statuses igual a '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); // 6Puede simplificar esto un poco usando un for...ofbucle:
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); // 6Además, puede crear una función para hacer lo mismo si tiene otras matrices de objetos para contar condicionalmente:
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); // 6Usa métodos de matriz
JavaScript incluye un montón de métodos útiles cuando se trabaja con matrices. Cada uno se puede encadenar a una matriz y pasar diferentes parámetros para trabajar mientras se itera a través de los elementos de la matriz.
Los dos que veremos son filter()y reduce().
filter()
El método de filtro hace exactamente eso: itera a través de cada elemento de la matriz y filtra todos los elementos que no cumplen con las condiciones que usted proporciona. Luego, devuelve una nueva matriz con todos los elementos que devolvieron verdaderos según su (s) condición (es).
Por ejemplo:
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' } ] */Ahora que ha filtrado el objeto con status: '1', simplemente llame al length()método en la nueva matriz para obtener el recuento total de objetos con 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; // 6Pero esto se puede acortar mucho con la sintaxis de 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; // 6reduce()
Piense en el reduce()método como una navaja suiza: es extremadamente flexible y le permite tomar una matriz como entrada y transformarla en casi cualquier cosa. Aún mejor, filter()este método devuelve una nueva matriz, dejando la original sin cambios.
Puede leer más reduce()en este artículo.
Para nuestros propósitos, queremos tomar una matriz, examinar su contenido y producir un número. Aquí tienes una forma sencilla de hacerlo:
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); // 6Puede simplificar aún más utilizando la sintaxis de ES6 y un operador ternario:
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); // 6E incluso un poco más mediante el uso de la desestructuración de objetos:
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); // 6Entonces, esas son algunas formas de revisar los elementos de una matriz y contarlos de forma condicional. ¡Ahora sal y cuenta con confianza!