HOWTO · JavaScript
Convertir objeto JSON en array de JavaScript
En este artículo, aprenderemos cómo convertir un objeto JSON en un array de JavaScript.
En esta página
JSON es un formato de texto. Si tus datos están en formato JSON, analízalos con JSON.parse() para obtener un valor de JavaScript antes de seleccionar propiedades o crear un array. Si ya tienes un objeto JavaScript, omite el análisis y elige la forma de array que necesitas: pares de clave y valor, solo valores o una selección personalizada. Estas operaciones crean arrays a partir de propiedades; no convierten automáticamente cualquier tipo de objeto en un array.
Los arrays de JavaScript son objetos con elementos indexados. Las posiciones del array empiezan en cero, mientras que los nombres de propiedad que devuelven los métodos de enumeración de objetos son cadenas. Por ejemplo, aunque un objeto se escriba con claves que parecen números, sus entradas siguen teniendo claves de tipo cadena.
Convertir texto JSON en un objeto JavaScript
Pasa una cadena JSON válida a JSON.parse(). Según el texto, el resultado puede ser un objeto, un array u otro valor JSON. El ejemplo analiza un objeto y después usa sus campos para crear un array de entradas.
Ejecuta este ejemplo:
El código y las etiquetas o salidas visibles de esta sección se mantienen en inglés.
const jsonText = '{"name":"Ada","role":"engineer"}';
const person = JSON.parse(jsonText);
const entries = Object.entries(person);
console.log(entries);
[ [ 'name', 'Ada' ], [ 'role', 'engineer' ] ]
Si la entrada no tiene un formato JSON válido, el análisis produce un SyntaxError; valida o gestiona los datos cuando entran en tu aplicación. No llames a JSON.parse() con un valor que ya sea un objeto. Para obtener más información, consulta la referencia de JSON.parse().
Convertir un objeto en pares de clave y valor con Object.entries()
Usa Object.entries(object) cuando necesites que cada resultado contenga tanto el nombre de una propiedad como su valor. Devuelve un array de arrays con dos elementos, como [key, value]. Incluye las propiedades propias, enumerables y con claves de tipo cadena del objeto. No incluye las propiedades heredadas ni las propiedades con claves de símbolo. Los nombres de propiedad que parecen números son cadenas en los pares resultantes.
Este método resulta útil cuando una operación posterior necesita ambos elementos, por ejemplo, para mostrar etiquetas con sus valores o transformar cada par. Para una explicación relacionada con los arrays de entradas, consulta arrays de entradas de JavaScript. El inventario no ofrece un destino localizado al español, por lo que se conserva el enlace existente en inglés.
Convertir un objeto en valores con Object.values()
Usa Object.values(object) cuando no necesites las claves. Devuelve los valores de las propiedades propias, enumerables y con claves de tipo cadena del objeto, en el mismo orden de propiedades que usa Object.entries(). El resultado es un array plano de valores, no un array de pares [key, value]. Elige este método si vas a procesar o mostrar solo los valores; usa Object.entries() si necesitas conservar la relación entre cada valor y su clave.
Por ejemplo, si un objeto tiene las propiedades name y role, Object.values(object) produce un array con los valores del nombre y del rol. Esta descripción explica la operación, pero no afirma que se haya observado un resultado durante la ejecución. Consulta la referencia de Object.values().
Usar for…in para una iteración personalizada
Un bucle for...in recorre las propiedades enumerables con claves de tipo cadena, incluidas las propiedades enumerables heredadas a través de la cadena de prototipos. Úsalo cuando necesites aplicar lógica personalizada durante la iteración. Si el resultado debe contener únicamente las propiedades propias del objeto, comprueba Object.hasOwn() antes de añadir cada elemento. Esta comprobación evita incluir propiedades enumerables heredadas.
El código y las etiquetas o salidas visibles de esta sección se mantienen en inglés.
const object = { name: 'Ada', role: 'engineer' };
const entries = [];
for (const key in object) {
if (Object.hasOwn(object, key)) {
entries.push([key, object[key]]);
}
}
console.log(entries);
[ [ 'name', 'Ada' ], [ 'role', 'engineer' ] ]
Este bucle crea, para las propiedades propias comprobadas, una forma de pares similar a la de Object.entries(), y permite filtrar o transformar elementos a medida que se recorren. Sin esa comprobación, también pueden añadirse propiedades enumerables heredadas. Para convertir propiedades en pares de forma estándar, Object.entries() es más breve y expresa directamente esa intención. Consulta la referencia de for...in para conocer su comportamiento de iteración.
Elegir la forma de array que necesitas
Empieza por identificar el tipo de entrada: analiza el texto JSON con JSON.parse(), pero usa directamente un objeto que ya exista. Después elige el resultado: Object.entries() para obtener pares, Object.values() para obtener solo valores o for...in con una comprobación de propiedades propias si necesitas filtrar o transformar elementos durante la iteración. Los dos métodos integrados seleccionan propiedades propias, enumerables y con claves de tipo cadena; un for...in sin comprobación también recorre propiedades enumerables heredadas con claves de tipo cadena. Ninguno de estos métodos incluye propiedades con claves de símbolo. Esta distinción ayuda a evitar elementos adicionales no deseados y a que el array resultante se ajuste a los datos que espera el siguiente paso.