hand Inicio
hand JSBloqs
hand GutenBloqs

Cómo pasar de un objeto a un array en JavaScript (por ejemplo viniendo de php?

Te explico cómo transformar un objecto en un array con Object.values

Transformando

Transformar un objeto en un array, cuándo lo vamos a necesitar?

La aplicación obvia es cuando queramos iterar sobre el objeto, esto ya lo hemos visto en entradas anteriores comparando distintos tipos de loops (tienes el blog por si te interesa)

Pero otra aplicación es cuando literalmente tenemos un array que no es un array

Por ejemplo, cuando tenemos datos importados de php

Esto ocurre (por ejemplo) cuando estamos en WordPress y queremos pasar información a JavaScript para poder utilizar React

En ese caso, si queremos exportar las entradas, estas por definición son un array de posts

Pero en php los arrays son raros, son en realidad objects con las keys que apuntan a los números

js
// JS
const array = ['primero', 'segundo', 'tercero']
console.log(array[0]) // primero
console.log(array[1]) // segundo
console.log(array[2]) // tercero
console.log(array) // ['primero', 'segundo', 'tercero']
php
// PHP
const array = ['primero', 'segundo', 'tercero'];
echo $array[0]; // primero
echo $array[1]; // segundo
echo $array[2]; // tercero
var_dump($array);

/*
array(3) {
[0]=>
string(7) "primero"
[1]=>
string(7) "segundo"
[2]=>
string(7) "tercero"
}
*/

Como puedes ver, la estructura que nos devuelve php es en realidad el equivalente a js a un objeto

js
const array = { '0': 'primero', '1': 'segundo', '2': 'tercero' }
console.log(array['0']) // primero
console.log(array['1']) // segundo
console.log(array['2']) // tercero
console.log(array)

/*
{
0: "primero",
1: "segundo",
2: "tercero"
}
*/

En este caso, tenemos un objeto donde sus keys son simplemente los índices de lo que sería un array

Lo que queremos, por lo tanto, es algo tan sencillo como utilizar Objet.values

js
const array = { '0': 'primero', '1': 'segundo', '2': 'tercero' }
const object = Object.values(array)
console.log(object) // ["primero", "segundo", "tercero"]

Algo tan sencillo como esto 🙋‍♂️

draw of me

Hola, tienes en mente desarrollar una web?

Si quieres, te ayudo

11ty para webs ultra-rápidaseleventy js
Gatsby para webs complejasgatsby js
WordPress para webs para el usuario finalwordpress

Escríbeme

Lista de correo: escribo algo de tanto en cuanto