javascript

Objeto a arreglo en JavaScript – Conversión

Convertir un objeto a arreglo en JavaScript

En este post te voy a mostrar a convertir un objeto o diccionario a un arreglo o array en JavaScript.

Vamos a repasar 3 funciones:

  1. Object.entries
  2. Object.values
  3. Object.keys
Objeto a arreglo en JavaScript usando Object.entries, values y keys

Tema de la captura: SynthWave ’84.

Esas funciones nos van a servir para convertir un objeto a arreglo en JavaScript de 3 formas. El primero extrayendo cada clave y valor como un nuevo arreglo, el segundo extrayendo únicamente los valores y el tercero obteniendo únicamente las claves.

Object.entries – Pares de arreglos

Comencemos viendo el método entries. Este método crea un nuevo arreglo de arreglos, en donde cada valor del arreglo es otro arreglo con dos valores.

El primer valor es la clave y el segundo el valor (suena confuso pero no lo es). Veamos un ejemplo:

See the gist on github.

Como ves, el objeto se ha convertido en un arreglo. Cada entrada del arreglo tiene un nuevo arreglo; en el índice 0 tiene la clave del objeto (el nombre del alumno) y en el índice 1 la calificación del mismo.

Puedes probar el ejemplo aquí.

Object.keys – Solo las claves

Para extraer únicamente las claves del objeto podemos usar el método Object.keys. Como su nombre lo dice, pondrá cada clave del objeto dentro de un arreglo.

Al final tendremos un arreglo de valores, valores que eran las claves del objeto anteriormente.

Veamos el ejemplo:

See the gist on github.

En este caso tenemos como resultado un arreglo de cadenas, pues son las claves del objeto o, en otras palabras, los nombres de los alumnos.

Puedes probar el ejemplo aquí.

Objeto a arreglo en JavaScript con Object.values

Ahora veamos el tercer ejemplo. El método Object.values toma todos los valores del objeto (no las claves) y los coloca dentro de un arreglo.

Veamos su uso:

See the gist on github.

Ahora la salida son los valores, que en este caso son las calificaciones.

Prueba el ejemplo aquí.

Conclusión

Cabe mencionar que estos métodos funcionan mejor en navegadores modernos.

Nota: estos ejemplos corren en el navegador y en Node.JS. Es decir, del lado del cliente y del servidor.

En mi blog puedes encontrar más sobre JavaScript moderno.

Encantado de ayudarte


Estoy disponible para trabajar en tu proyecto, modificar el programa del post o realizar tu tarea pendiente, no dudes en ponerte en contacto conmigo.

No te pierdas ninguno de mis posts

Suscríbete a mi canal de Telegram para recibir una notificación cuando escriba un nuevo tutorial de programación.
parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

Entradas recientes

Plugin ESC POS – Actualización 3.4.0: imprimir HTML

El plugin para imprimir en impresoras térmicas alcanza hoy su versión 3.4.0 agregando soporte para…

1 día hace

JavaScript (lado del cliente): leer pixeles de imagen

En ocasiones es necesario leer los pixeles y colores de una imagen con JavaScript del…

1 semana hace

PHP y JavaScript: llenar select con AJAX

Siguiendo con los tutoriales de listas desplegables o select con JavaScript, vamos a ver cómo…

1 semana hace

Imprimir PDF generado con HTML

Hoy vamos a ver programar la impresión de un PDF generado a partir de HTML…

1 semana hace

JavaScript: llenar select con arreglo

En este tutorial básico de JavaScript con HTML vamos a ver cómo llenar una lista…

2 semanas hace

Imprimir PDF a partir de URL

En este artículo se presenta una guía para imprimir un PDF a partir de una…

2 semanas hace

Esta web usa cookies.