Contenido del curso

¿Qué se implementó en ES6?

Object.entries e Object.values no JavaScript

Resumen

ECMAScript 8, lanzado en junio de 2017, trajo dos métodos que cambian la forma de manipular objetos en JavaScript: Object.entries y Object.values. Si trabajas con datos que llegan como objetos y necesitas recorrerlos, filtrarlos o transformarlos, estos métodos te dan el puente directo hacia los arrays. Aquí verás cómo funcionan con ejemplos concretos de código.

¿Qué hace Object.entries en JavaScript?

El método Object.entries devuelve una matriz de pares clave-valor a partir de las propiedades enumerables propias de un objeto. En otras palabras, convierte un objeto en un array donde cada elemento es, a su vez, un array con dos posiciones: la clave y el valor.

Mira el ejemplo con un objeto de países:

javascript const countries = { MX: 'México', CO: 'Colombia', CL: 'Chile', PE: 'Perú' };

console.log(Object.entries(countries));

Al ejecutar este código en consola, el objeto deja de tener la estructura clásica clave-valor y se transforma en una matriz donde cada par aparece como ['MX', 'México'], ['CO', 'Colombia'], y así sucesivamente [01:30].

¿Para qué sirve Object.entries? Sirve para convertir un objeto en un array iterable y aplicarle métodos como map, filter o reduce. Es útil cuando recibes datos en formato objeto y necesitas recorrerlos como lista.

¿Por qué transformar un objeto en array?

Cuando manipulas información en JavaScript, muchas veces el formato que recibes no coincide con el que necesitas. Tener los datos en un array te abre la puerta a:

  • Aplicar algoritmos de recorrido secuencial.
  • Usar métodos funcionales como map, filter y reduce.
  • Acceder a los elementos por índice numérico.
  • Volver a transformarlo en objeto cuando termines.

Esa flexibilidad de ida y vuelta entre objeto y array es lo que vuelve a Object.entries una herramienta tan práctica en el día a día.

¿Qué devuelve Object.values y en qué se diferencia?

El método Object.values devuelve un array con los valores correspondientes a las propiedades enumerables de un objeto. La diferencia con entries es directa: aquí no te interesa la clave, solo el valor.

Usando el mismo objeto de países:

javascript const countries = { MX: 'México', CO: 'Colombia', CL: 'Chile', PE: 'Perú' };

console.log(Object.values(countries));

El resultado en consola es una matriz simple de strings: ['México', 'Colombia', 'Chile', 'Perú']. Las claves MX, CO, CL y PE quedan fuera, porque el método solo extrae los valores [04:20].

¿Cuándo uso Object.values en lugar de Object.entries? Usa Object.values cuando solo necesites los valores del objeto. Usa Object.entries cuando además necesites la clave asociada a cada valor.

¿Cómo combinar estos métodos con map, filter y reduce?

Una vez que tienes el array, puedes encadenar los métodos de manipulación de arrays para resolver problemas reales. Por ejemplo:

  • map para transformar cada valor en otro formato.
  • filter para quedarte solo con los países que cumplan una condición.
  • reduce para acumular un resultado final, como concatenar nombres o contar elementos.

Esta es la gran ventaja que te da ECMAScript 8: te ahorra escribir bucles manuales para extraer claves o valores y te entrega la información lista para procesar de forma funcional.

¿Qué conceptos clave debes recordar de ECMAScript 8?

Estas son las ideas centrales que aparecen en los ejemplos y que conviene fijar antes de pasar a las siguientes funcionalidades de la versión:

  • ECMAScript 8 es la versión de JavaScript publicada en junio de 2017 [00:10].
  • Propiedades enumerables: son las propiedades propias de un objeto que pueden recorrerse en un bucle. Tanto entries como values trabajan únicamente sobre ellas.
  • Pares clave-valor: la estructura básica de un objeto en JavaScript, donde cada propiedad tiene un nombre (clave) y un contenido (valor).
  • Matriz de matrices: la salida de Object.entries, donde cada elemento del array externo es a su vez un array de dos posiciones.
  • Transformación de datos: el patrón de convertir entre objeto y array según lo que necesites en cada momento del flujo de tu programa.

Si quieres profundizar en cómo aprovechar al máximo map, filter y reduce sobre los arrays que generes con estos métodos, el curso de manipulación de arrays de Nicolás Molina en Platzi es una excelente continuación. Cuéntame en los comentarios qué caso de uso real has resuelto con Object.entries u Object.values en tus proyectos.