DevPath · Aprende a programar ESPTEN

Objetos

Recorrer objetos: keys, values y entries

Recorrer un objeto

Imagina un carrito con los precios de cada producto y quieres sumar el total. Para eso necesitas recorrer el objeto. El problema: a diferencia de los arrays, los objetos no tienen índices numéricos, así que no hay un [0], [1] al que agarrarse. La solución son las utilidades de Object.

Object.keys: las claves

const persona = { nombre: "Ana", edad: 30 };
console.log(Object.keys(persona)); // ["nombre", "edad"]

Object.values: los valores

console.log(Object.values(persona)); // ["Ana", 30]

Object.entries: pares [clave, valor]

console.log(Object.entries(persona));
// [["nombre", "Ana"], ["edad", 30]]

Recorrer con for...in

El bucle for...in itera sobre las claves de un objeto:

for (const clave in persona) {
  console.log(clave, "=>", persona[clave]);
}

Combinar con métodos de array

Aquí se cierra el círculo: como Object.keys y Object.values devuelven arrays, puedes encadenar el map, filter o reduce que ya dominas. Aquel carrito del principio, resuelto en una línea:

const precios = { pan: 2, leche: 1, cafe: 5 };
const total = Object.values(precios).reduce((a, b) => a + b, 0); // 8

Y con esto cierras el bloque de fundamentos de JavaScript. Para aquí un momento y fíjate en lo que ya sabes hacer: variables, condicionales, bucles, funciones, arrays y ahora objetos con métodos. Ya no escribes "trozos sueltos": modelas datos del mundo real y los procesas. A partir de aquí (ES6, el DOM…) todo se construye sobre estos cimientos. Bien hecho.

Ejemplos

Calcular la nota media a partir de un objeto de notas

const notas = { mates: 8, lengua: 7, ciencias: 9 };
const claves = Object.keys(notas);
const suma = Object.values(notas).reduce((a, b) => a + b, 0);
console.log(claves);           // ["mates", "lengua", "ciencias"]
console.log("Media:", suma / claves.length); // 8
Pon esto en práctica

DevPath es un curso práctico: aquí lees la teoría; en la app la pones en práctica con ejercicios que se ejecutan de verdad, sin conexión.

Empezar gratis en la app →
← Métodos y thisVer el módulo →