JSON a tabla
Muestra un array de objetos como una tabla ordenable y legible.
Nada de lo que pegues sale de tu navegador. La lista de permitidos de connect-src convierte eso en una garantía del navegador, no en una promesa. Compruébalo tú mismo
Un array de objetos mostrado como una tabla que de verdad se puede leer, con todas las columnas descubiertas a lo largo de todas las filas en vez de tomadas de la primera.
Ese último punto es toda la diferencia. Un conversor que lee las claves del elemento cero descarta en silencio todos los campos que solo aparecen más adelante, y te enteras aguas abajo, cuando falta una columna.
Cómo se deciden las filas y las columnas
- Un array de objetos
- Una fila por elemento. El caso obvio y el habitual.
- Un objeto envoltorio
- Un payload con la forma {"ok": true, "data": [...]} usa el array como origen de las filas, y lo dice, porque eso es una suposición y no una regla.
- Un único objeto
- Una fila.
- Un array de escalares
- Una sola columna llamada value.
- Columnas
- La unión de todas las rutas de todas las filas, en el orden en que apareció cada una por primera vez.
Valores anidados dentro de una celda
Los objetos anidados se convierten en columnas con puntos: address.city en vez de una celda que contiene JSON. Los arrays anidados se representan aquí como JSON dentro de la celda, porque una tabla con tags.0 hasta tags.47 como columnas separadas no es una tabla que nadie pueda leer.
Si quieres la forma con columnas indexadas, o una fila por elemento del array, usa la página de JSON a CSV, donde esas políticas son configurables.
How to do this in code
Producir una tabla a partir de JSON en código.
py Python
import pandas as pd
df = pd.json_normalize(records)
print(df.to_markdown(index=False))
df.to_csv('out.csv', index=False) sh jq
La parte map(keys) | add | unique es la que hace que esto tome la unión y no el primer objeto.
# Header row from the union of all keys, then the rows
jq -r '(map(keys) | add | unique) as $cols
| $cols, (.[] | [.[$cols[]]])
| @csv' records.json js JavaScript
const columns = [...new Set(records.flatMap(Object.keys))];
const rows = records.map((r) => columns.map((c) => r[c] ?? ''));
console.table(records); // in a browser console or Node Preguntas frecuentes
- ¿Por qué hay una columna vacía en algunas filas?
- Porque esa clave no está en esos objetos. La columna existe porque al menos una fila la tiene. Una celda vacía significa que faltaba la clave; una celda con null significa que la clave estaba presente con valor null.
- ¿Puedo ordenar por una columna?
- En esta vista previa no. Descarga el CSV y ordénalo en una hoja de cálculo, o consulta el documento con JSONPath si necesitas un subconjunto filtrado.