«¿JSON» o «¿JaySon»? ¿JSON o JSON5? Respondemos a estas y muchas otras preguntas.

Qué es JSON

Qué es JSON
Qué es JSON

JSON (JavaScript Object Notation) es un formato de texto estándar para almacenar y transferir datos estructurados. Se basa en la sintaxis de objetos en JavaScript, pero no está ligado a él. Muchos lenguajes de programación modernos lo soportan: Python, Java y otros.

Antes de la creación del formato JSON, las solicitudes al servidor requerían una actualización constante de la página en el navegador. Esto ralentizaba el funcionamiento de los sitios web. Las solicitudes AJAX, que funcionan con el formato JSON, se ejecutan en segundo plano y no requieren la actualización de la página. Gracias a esto, la velocidad de trabajo con los recursos web aumentó significativamente y JSON se convirtió en el estándar de transferencia de datos en Internet.

¿Cómo Surgió JSON?

El creador de JSON es Douglas Crockford, un conocido programador estadounidense y uno de los desarrolladores de JavaScript. Es autor del popular analizador estático de código JSLint y de los libros JavaScript: The Good Parts y How JavaScript Works.

Imagen de Douglas Crockford
Imagen de Douglas Crockford

«Descubrí JSON. No afirmo haberlo inventado, ya que ya existía en la naturaleza. Simplemente lo encontré, le di un nombre y expliqué su utilidad. Sé que hay otras personas que lo descubrieron, al menos un año antes que yo. El primer caso que conozco está relacionado con Netscape: alguien de la compañía usó literales de arreglos de JavaScript para transferir datos en 1996, es decir, al menos cinco años antes de que yo me topara con esta idea».

DOUGLAS CROCKFORD,
The JSON Saga

A principios de 2001, Douglas Crockford y Chip Morningstar fundaron la empresa State Software. Trabajando en proyectos, se encontraron con un problema: la transferencia de datos entre el servidor y el navegador requería una actualización constante de la página, lo que ralentizaba el trabajo.

Para resolver este problema, se utilizaban diferentes enfoques, como complementos especiales para navegadores basados en Flash o applets Java. Pero trabajar con ellos era complejo y se producían errores frecuentes.

Entonces, Crockford recordó la idea que escuchó por primera vez de alguien de Netscape e implementó un objeto JavaScript dentro del código HTML, que transmitía un mensaje a la página. La primera versión se veía así:

<html>
<head>
<script>
    document.domain = "fudco";
    parent.session.receive(
        { to: "session," do: "test,"
          text: "Hello world" }
    )
</script>
</head>
</html>

Este código debía enviar un mensaje desde una ventana hija a una ventana principal utilizando el objeto parent. Pero no funcionó porque la palabra do estaba reservada en JavaScript. Para evitar este problema, Crockford usó comillas, incluyendo todas las palabras dentro del objeto:

<html>
<head>
<script>

 document.domain = 'fudco';
    parent.session.receive(
        { "to": "session", "do": "test",
          "text": "Hello world" }
    )
</script>
</head>
</html>

Así apareció un nuevo formato que inicialmente se quería llamar JSML (JavaScript Markup Language), pero ganó el nombre de JSON (JavaScript Object Notation).

En 2001, Crockford creó una página web con una descripción de este formato, para que todos los desarrolladores pudieran usarlo en su trabajo.

«Al desarrollar JSON, buscaba el minimalismo. Mi idea era que cuantas menos preguntas tuviéramos que acordar, mayor sería la probabilidad de que simplemente interactuáramos entre nosotros. Quería que el estándar JSON cupiera en la parte posterior de una tarjeta de visita».

DOUGLAS CROCKFORD,
Hackernoon
Imagen de una tarjeta de visita con el estándar JSON
Imagen de una tarjeta de visita con el estándar JSON

JSON se diferenciaba de sus competidores – XML, CSV y YAML – por la simplicidad de su sintaxis y el pequeño tamaño de los archivos, lo que era conveniente para trabajar con la web. Gracias a esto, ganó popularidad rápidamente.

Gráfico de la cantidad de consultas en StackOverflow
Gráfico de la cantidad de consultas en StackOverflow

En 2014, el organismo de normalización ECMA adoptó JSON y lo especificó oficialmente. Hoy, este formato es el principal para la transferencia de datos en la interacción entre el servidor web y el navegador.

En esta sección, también responderemos a la principal pregunta de los desarrolladores: ¿cómo se pronuncia JSON? Hay dos opciones: con acento en la «e» y en la «o». La mejor respuesta la dará uno de los desarrolladores del formato: Chip Morningstar.

«Mucha gente dice ‘JaySon’, lo que siempre me alegra. Cada vez que estoy en una reunión y alguien dice ‘JaySon’, respondo ‘JSON’. Me preguntan: «¿De dónde lo sabes?» Y les respondo: «Bueno, porque fui yo quien lo inventó».

CHIP MORNINGSTAR,
Oral History of Chip Morningstar

Ventajas de JSON

JSON no es el único formato de transferencia de datos. Algunos desarrolladores usan XML o YAML. Pero en comparación con ellos, JSON tiene una serie de ventajas:

  • Sintaxis simple y fácil de leer, comprensible tanto para la computadora como para el ser humano. No es necesario comprender JavaScript para aprender a escribir y leer datos. Pronto lo verás por ti mismo.
  • Ligereza y compacidad. Los archivos JSON pesan menos que los archivos de otros formatos y se cargan más rápido. Según algunos estudios, los navegadores modernos procesan JSON decenas de veces más rápido que XML.
  • Independencia de un lenguaje de programación específico. Para trabajar con JSON se puede utilizar casi cualquier lenguaje de programación popular, como Python o Java.
  • Versatilidad en los tipos de datos. JSON se puede usar para almacenar arreglos, listas ordenadas y colecciones de pares «clave-valor». Pero eso no es todo. El formato es adecuado para representar estructuras de datos complejas, incluyendo árboles y estructuras jerárquicas.
  • Amplia compatibilidad en los navegadores. Todos los navegadores modernos son compatibles con JSON.
  • Documentación autónoma. En JSON se pueden incluir metadatos que describen los datos presentados, simplificando el trabajo con ellos.

Estructura y Sintaxis de JSON

La sintaxis de JSON repite la sintaxis de un objeto normal en JavaScript: los datos se escriben en forma de pares «clave-valor» y se separan por comas. Es importante recordar que después del último par no se coloca coma: este es un error común que se puede buscar durante mucho tiempo.

Las claves son variables de cadena de texto, mientras que los valores pueden ser cadenas de texto, números, valores booleanos, objetos, arreglos o nulos. Las funciones y las fechas no se admiten en JSON normal.

Así es como se ve un archivo JSON simple:

//clave      // valor
{
  "name": "John Smith",
  "age": 37
}

A pesar de la vinculación inicial del formato a JavaScript, la especificación de JSON permite cosas que no son válidas en el código JavaScript. Por ejemplo, en JSON, los símbolos de separación de líneas y párrafos se pueden indicar sin escapar.

Para trabajar con fechas en JSON, es necesario convertirlas a formato de cadena de texto de acuerdo con el estándar ISO 8601:

2024-07-24T20:45:03.408Z

Se puede encontrar una descripción detallada de los requisitos de la sintaxis de JSON en el sitio web de Datatracker. Para verificar la corrección de la sintaxis o su formato de acuerdo con las reglas, existen muchos validadores en línea, como JSON Validator.

Objetos y Arreglos JSON

Para almacenar datos en JSON, se utilizan dos estructuras: objetos y arreglos.

Los objetos son una colección no ordenada. No importa el orden en que se coloquen los pares «clave-valor». Es decir, se pueden intercambiar. ¡Pero tenga cuidado! Cuando un desarrollador mueve un par «clave-valor» de cualquier lugar a la última posición, a menudo olvida eliminar la coma, lo que genera un error.

Un objeto JSON es muy similar a un objeto en JavaScript, pero la clave siempre debe estar entre comillas. Por ejemplo:

{
    "name": "Ana",
    "age": 34,
    "married": true
}

Los arreglos son una lista ordenada de valores. Se ven así:

[
    "manzana",
    "melocotón",
    "plátano",
    "kiwi"
]

A diferencia de los objetos, el orden de los elementos en un arreglo es importante. Aquí no hay claves, por lo que solo podemos acceder a los valores por el índice del elemento. Es importante recordar que el primer elemento tiene el índice 0.

Los objetos y los arreglos se pueden anidar entre sí, y el número de niveles de anidamiento no está limitado.

¿Qué es JSON5?

JSON5 es una extensión del estándar JSON que aumenta la legibilidad y la comodidad de escribir datos JSON. Además, agrega nuevas posibilidades, como el uso de comentarios, que no están presentes en el estándar mismo.

Las principales diferencias de JSON5, útiles en el trabajo:

  • Se permiten los comentarios:
{
// Este es un comentario
}
  • No es necesario usar comillas para las claves, pero solo si la clave está compuesta de letras, números o guiones bajos y no es una palabra reservada:
{ key: "value", // Clave sin comillas
}
  • Existe un formato especial para fechas y horas:
{ date: new Date(), // Valor-fecha
}
  • Se admite texto multilínea, lo que permite escribir cadenas de texto sin la necesidad de escapar incómodo:
{multiline: `Este es 
              texto multilínea 
              con salto de línea`,}
  • Se permite escribir números con guiones bajos para mejorar la legibilidad:
{ largeNumber: 1_000_000, // Número con guiones bajos para mejorar la legibilidad
}
  • Se admite el sistema hexadecimal y octal:
{hexValue: 0xCAFE_BABE // Número hexadecimal
}
❌
Es importante recordar que JSON5 no es compatible con todos los analizadores, aplicaciones y bibliotecas, lo que aún limita su uso.

¿Qué es JSON Schema?

Para describir y verificar datos en formato JSON, existe un lenguaje especial llamado JSON Schema. Supongamos que tenemos un archivo JSON normal:

{
  "name": "John Doe",
  "age": 30,
  "address": {
    "city": "New York",
    "zip": "10001"
  }
}

El desarrollador no sabe qué campos son obligatorios, a qué tipo de datos pueden pertenecer los valores, etc. JSON Schema permite agregar los metadatos necesarios, o «reglas» para esta información, y describir qué campos deben estar rellenados y qué pueden contener.

JSON Schema se utiliza para validar datos al intercambiar información entre diferentes sistemas o al trabajar con datos recibidos de los usuarios. Si los nuevos datos no cumplen con la esquema establecida, el desarrollador lo sabrá rápidamente y podrá estudiar detenidamente la información, corrigiéndola o solicitando una actualización.

Gracias a esto, el código se vuelve confiable, predecible y resistente a errores, permitiendo definir explícitamente los requisitos para la presentación de datos. Así es como se verá el archivo mencionado anteriormente, descrito con la ayuda de JSON Schema:

{
  "$schema": "http://json-schema.org/draft-07/schema#",
  "type": "object",
  "properties": {
    "name": {
      "type": "string"
    },
    "age": {
      "type": "number"
    },
    "address": {
      "type": "object",
      "properties": {
        "city": {
          "type": "string"
        },
        "zip": {
          "type": "string"
        }
      },
      "required": ["city", "zip"]
    }
  },
  "required": ["name", "age", "address"]
}

Analicemos el código línea por línea:

  • en la primera línea se indica la referencia a la versión de la especificación de JSON Schema;
  • los datos deben ser un objeto de tipo «object»;
  • el objeto debe contener tres campos obligatorios: «name», «age» y «address»;
  • cada campo tiene su propio tipo de datos: «string» para el nombre, «number» para la edad y «object» para la dirección;
  • el campo «address» debe ser un objeto y contener dos subcampos obligatorios: «city» y «zip», que pertenecen a las cadenas de texto.

Cómo Trabajar con JSON

Saber trabajar con archivos JSON es una de las habilidades básicas para los desarrolladores, ya que este formato es el estándar para el intercambio de datos en aplicaciones web y móviles.

Por lo general, trabajar con JSON se reduce a dos acciones: serialización y deserialización. Hablemos de ellos con más detalle.

La serialización es la conversión de datos desde un formato interno, por ejemplo, desde un objeto JavaScript, a un formato JSON, que se puede enviar al servidor. En la mayoría de los lenguajes de programación, existen funciones o bibliotecas integradas para ello. Por ejemplo, en JavaScript, la conversión del objeto person a un archivo JSON se ve así:

const person = {
  name: 'John Doe',
  age: 30,
  address: {
    city: 'New York',
    zip: '10001'
  }
};

const jsonString = JSON.stringify(person); // El método JSON.stringify convierte el objeto person a formato JSON

console.log(jsonString); // Muestra los datos en la consola

La deserialización, por el contrario, convierte los datos del formato JSON nuevamente al formato interno con el que el programador puede trabajar en su código:

const jsonString = '{"name":"John Doe","age":30,"address":{"city":"New York","zip":"10001"}}';

const person = JSON.parse(jsonString); // Convertimos JSON al objeto person

console.log(person); // Muestra los datos en la consola

Qué Recordar

Recordemos todo lo que hemos aprendido sobre JSON:

  • JSON es un formato de texto estándar para almacenar y compartir datos estructurados. Se utiliza principalmente en la web.
  • Los datos en JSON se presentan en forma de pares «clave-valor».
  • Para almacenar datos en JSON, se utilizan dos estructuras: objetos y arreglos. Los objetos son una colección no ordenada, los arreglos son ordenados.
  • JSON5 amplía las posibilidades del formato, pero aún no es compatible con los navegadores.
  • JSON Schema se utiliza para definir los requisitos para los datos: el desarrollador puede indicar los campos obligatorios y sus formatos permitidos.
  • Para trabajar con JSON se utilizan dos enfoques principales: la serialización, que permite convertir código JavaScript o código de otro lenguaje de programación a formato JSON, y la deserialización, que funciona al revés: desde el formato JSON, los datos se traducen a código normal.

No te olvides compartirlo 😉

Categorizado en:

Fundamentos,