JSON, explicado: El formato de datos que mueve la web en silencio

En una frase

JSON es un formato ligero basado en texto para estructurar e intercambiar datos, fácil de leer para los humanos y de procesar (o parsear) para las máquinas.

El problema que resuelve

En los viejos tiempos de la web (finales de los 90 y principios de los 2000), si querías que tu sitio web obtuviera nuevos datos sin recargar la página completa, probablemente usabas una tecnología llamada AJAX (Asynchronous JavaScript and XML). Y como su nombre lo indica, el formato de datos preferido era XML.

XML es potente, pero también es... verboso. Es tosco. Está lleno de etiquetas de apertura, etiquetas de cierre, atributos y namespaces. Parsearlo en JavaScript, el lenguaje del navegador, era una lata. Tenías que navegar por un árbol de documento engorroso y simplemente no se sentía nativo.

<!-- Esto es solo un usuario. Imagina una lista de miles. Uff. -->
<user id="123">
  <username>coder_dave</username>
  <isActive>true</isActive>
  <roles>
    <role>admin</role>
    <role>editor</role>
  </roles>
</user>

Alrededor de 2001, un desarrollador llamado Douglas Crockford estaba trabajando en un proyecto y necesitaba una forma más simple de pasar datos al navegador. Tuvo una revelación brillante: JavaScript ya tenía una forma perfectamente buena de representar estructuras de datos: su propia sintaxis de objetos literales. ¿Y si pudieras simplemente enviar datos como una cadena de texto que pareciera un objeto de JavaScript?

Este fue el nacimiento de JSON (JavaScript Object Notation). Un servidor podía enviar este texto:

{
  "id": 123,
  "username": "coder_dave",
  "isActive": true,
  "roles": ["admin", "editor"]
}

...y el navegador podía, con un mínimo esfuerzo, convertirlo en un objeto nativo de JavaScript con el que podía trabajar al instante. Era ligero, limpio y perfectamente adaptado a la lengua nativa de la web. Esta simplicidad causó una explosión cámbrica de APIs web, impulsando el auge de las aplicaciones dinámicas de página única (single-page applications), los backends móviles y, básicamente, todo el internet moderno tal como lo conocemos. JSON no solo resolvió un problema técnico; engrasó los engranajes para toda una nueva generación de software.

Cómo funciona por debajo

En esencia, JSON es solo un conjunto de reglas para escribir datos como texto. Las reglas son simples, y es precisamente por eso que tiene tanto éxito.

Los Bloques de Construcción: Claves y Valores

El universo entero de JSON se construye sobre una estructura simple: el par clave-valor.

"clave": valor

• La clave (key) es siempre un string (cadena de texto), encerrada en comillas dobles. Esto no es negociable.
• El valor (value) puede ser uno de unos pocos tipos de datos específicos.

Este par describe una sola pieza de información, como "nombre": "Luke Skywalker" o "edad": 19.

Los Tipos de Datos

JSON es estricto con sus tipos de valor. No puedes simplemente meter cualquier cosa ahí. Tienes seis tipos básicos más null.

Tipo	Ejemplo	Descripción
String	"La fuerza es intensa en este."	Cualquier texto. Debe estar entre comillas dobles.
Number	1138 o 3.14	Números enteros o de punto flotante. Sin distinción.
Boolean	true o false	Siempre en minúsculas. Representa un estado binario.
Array	["Tatooine", "Dagobah", "Bespin"]	Una lista ordenada de valores, encerrada entre [].
Object	{ "arma": "sable de luz", "color": "verde" }	Una colección no ordenada de pares clave-valor, encerrada entre {}.
Null	null	Representa la ausencia intencional de un valor.

Eso es todo. Nota lo que falta: funciones, fechas (se envían como strings), undefined y, lo más famoso, los comentarios. Este minimalismo es una característica, no un error (feature, not a bug); mantiene el formato sin ambigüedades y fácil de parsear para cualquier lenguaje de programación.

Estructurando Datos: Objetos y Arrays

El verdadero poder viene de anidar estos tipos. El valor en un par clave-valor puede ser otro objeto o un array. Esto te permite construir estructuras de datos arbitrariamente complejas.

Los objetos ({...}) se usan para agrupar datos relacionados sobre una sola "cosa". Piensa en ello como la entrada de un diccionario o un perfil.

Los arrays ([...]) se usan para listas ordenadas de elementos. Los elementos de un array pueden ser de cualquier tipo, incluso mezclados (aunque generalmente es una buena práctica mantenerlos uniformes).

Veamos un ejemplo más completo:

{
  "squadName": "Star Wars Heroes",
  "formed": 1977,
  "active": true,
  "members": [
    {
      "name": "Luke Skywalker",
      "age": 19,
      "secretIdentity": null,
      "powers": [
        "Trucos mentales Jedi",
        "Pilotaje",
        "La Fuerza"
      ]
    },
    {
      "name": "Han Solo",
      "age": 29,
      "secretIdentity": null,
      "powers": [
        "Puntería con bláster",
        "Sarcasmo",
        "Carrera Kessel en menos de 12 pársecs"
      ]
    }
  ]
}

¿Ves? Tenemos un objeto externo que describe el escuadrón. Una de sus propiedades, "members", es un array. Cada elemento de ese array es otro objeto, que representa a un solo héroe. Y cada objeto de héroe tiene sus propias propiedades, una de las cuales ("powers") es otro array de strings. Así es como se construye un árbol de datos con JSON.

De Texto a Objeto: El Parsing

El truco de magia es convertir este texto en algo que un programa pueda usar.

1. Serialización: Una aplicación del lado del servidor (server-side), escrita en Python, Java, Go, etc., tiene datos en memoria. Usa una librería de JSON para serializar esos datos en una cadena de texto con formato JSON. En JavaScript, esto es JSON.stringify().
2. Transmisión: Esta cadena se envía a través de la red, típicamente como el cuerpo (body) de una respuesta HTTP.
3. Parsing (Análisis sintáctico): El cliente (como un navegador web) recibe esta cadena. Utiliza un parser de JSON incorporado para convertir la cadena de nuevo en una estructura de datos nativa que pueda manipular. En JavaScript, esto es JSON.parse().

Este proceso de dos pasos de stringify-and-parse (serializar y parsear) es el latido de la comunicación web moderna.

Historias del mundo real

La App Móvil con el Bug Fatal

Una startup lanzó una app móvil de pedidos para una cadena de restaurantes local. Una mañana, la app empezó a crashear para todos los usuarios al abrirla. El equipo de desarrollo estaba en modo pánico total. Los logs del servidor mostraban que la API estaba enviando un estado 200 OK, y los datos se veían bien a simple vista. Después de horas de depuración frenética, finalmente inspeccionaron el texto crudo de la respuesta de la API. Un desarrollador de backend, tratando de ser útil, había agregado una nota para sus colegas directamente en el código que generaba el JSON: // TODO: Confirmar horarios de fin de semana. Este comentario se estaba incluyendo en la cadena JSON final. Aunque inofensivo en el código, un comentario hace que el JSON sea inválido. El estricto parser de JSON de la app vio el inesperado // y falló de inmediato, haciendo que la app crasheara antes de que pudiera mostrar un mensaje de error.

Lección: Los parsers de JSON no perdonan. El formato está estrictamente definido por una razón: garantizar la interoperabilidad. Un solo carácter inválido —un comentario, una coma al final (trailing comma), una comilla simple— hará que un parser válido rechace todo el contenido (payload).

El Fiasco de los Precios Internacionales

Una empresa de e-commerce estadounidense se estaba expandiendo a Alemania. Su API enviaba información de productos como JSON, incluyendo un campo price. Para un artículo de $19.95, el JSON era "price": 19.95. En preparación para el lanzamiento en Alemania, un desarrollador actualizó el backend para formatear el precio según las convenciones alemanas, donde la coma es el separador decimal. La API comenzó a enviar "price": "19,95". El código del frontend, sin embargo, todavía esperaba un número. En JavaScript, parseFloat("19,95") se evalúa como solo 19, descartando todo después de la coma. De repente, todos los productos en Alemania se mostraban con un descuento masivo e incorrecto.

Lección: JSON es para datos crudos, no para presentación. El tipo de dato importa. Un precio es un número, así que envíalo como un número (19.95). Deja que la aplicación del lado del cliente (client-side, el navegador o la app móvil) se encargue de formatear ese número como $19.95, 19,95 € o ¥19 según la configuración regional del usuario. No mezcles los datos con la lógica de presentación.

El Archivo de Configuración que No se Podía Explicar

Un pequeño equipo estaba configurando un nuevo servicio usando un archivo config.json para almacenar cadenas de conexión de base de datos, claves de API y feature flags. A medida que la configuración se volvía más compleja, necesitaban desesperadamente agregar comentarios para explicar qué hacía cada configuración críptica y por qué tenía un valor particular. Pero JSON prohíbe los comentarios. Su "solución" fue crear un archivo config_documentation.md que tenía que mantenerse sincronizado con config.json. Esto se convirtió rápidamente en un gran fastidio. Finalmente, se dieron cuenta de su error.

Lección: Usa la herramienta adecuada para cada trabajo. JSON es el campeón indiscutible para el intercambio de datos entre máquinas (como una respuesta de API). Pero para archivos de configuración mantenidos por humanos donde los comentarios y la legibilidad son críticos, otros formatos como YAML o incluso un simple archivo .js suelen ser una opción mucho mejor.

Errores y trampas comunes

• Comas al final (Trailing Commas): Agregar una coma después del último elemento en un objeto o array ("key": "value",}) hará que tu JSON sea inválido. Es un error común para los desarrolladores acostumbrados a sintaxis más permisivas en JavaScript.
• Comentarios: No puedes ponerlos. // y /* ... */ no son parte de la especificación y romperán el parsing. Si necesitas agregar metadatos, debes hacerlo dentro de la propia estructura de datos, por ejemplo: { "_comment": "Esta es mi nota", "realData": "..." }.
• Comillas simples: Todas las claves y todos los valores de tipo string deben usar comillas dobles ("). Usar comillas simples (') es JSON inválido, aunque sea común en JavaScript.
• Claves undefined: Enviar {"key": undefined} no es posible. El par clave-valor generalmente se omitirá durante la serialización. Para representar un valor ausente, usa null.
• Usar números como strings: Aunque puedes enviar un número como un string (p. ej., "id": "123"), es una mala práctica. Obliga a la aplicación receptora a hacer un trabajo extra para convertirlo de nuevo a número y puede llevar a bugs sutiles (por ejemplo, "10" > "9" es false en la comparación de strings).

Por qué debe estar en tu radar

Si tocas código de cualquier forma, te vas a encontrar con JSON. No es una cuestión de si lo harás, sino de cuándo y con qué frecuencia.

• Desarrolladores Web: Consumirás JSON de APIs y lo enviarás desde tus formularios. Todo el estado de tu aplicación probablemente se gestione como un objeto tipo JSON.
• Desarrolladores Backend: Construirás APIs que producen JSON y consumen JSON de otros servicios.
• Desarrolladores Móviles: Te comunicarás con tu backend exclusivamente a través de APIs que hablan JSON.
• DevOps/SREs: Las herramientas de Infraestructura como Código (Infrastructure-as-Code), los pipelines de CI/CD y las APIs de los proveedores de la nube se configuran y gestionan con JSON o formatos similares.
• Científicos de Datos: Extraerás datos de APIs web, y casi siempre llegarán como JSON.
• Curiosos que no son desarrolladores: Entender la sencilla estructura clave-valor de JSON puede desmitificar cómo las apps de tu teléfono obtienen sus datos y cómo los sitios web cargan contenido dinámicamente. Es un vistazo bajo el capó del mundo digital.

JSON es la lingua franca de los datos en internet. Conocer sus reglas y su propósito es una habilidad fundamental para cualquiera que construya o trabaje con software moderno.

Para profundizar

• JSON.org: La especificación original de una página de Douglas Crockford. Una clase magistral de simplicidad.
• RFC 8259: El "estándar" oficial de la IETF que formaliza el formato JSON para internet.
• MDN: Working with JSON: La guía definitiva para desarrolladores de JavaScript, que explica JSON.parse() y JSON.stringify().
• Wikipedia: JSON: Ofrece un gran resumen de la historia, sus derivados (como GeoJSON) y comparaciones con otros formatos.