Aprendiendo sobre JSON en JavaScript

Cuando gestionamos grandes volúmenes de datos en nuestras aplicaciones, es una buena práctica separar la lógica del programa de la información que utiliza. Esto permite mantener un código más organizado y facilita la actualización de los datos sin necesidad de modificar el código fuente.

¿Qué es JSON?

JSON, acrónimo de JavaScript Object Notation, es un formato ligero y ampliamente utilizado para el intercambio de datos. Su estructura está inspirada en la sintaxis de los objetos en JavaScript, por lo que resulta especialmente familiar para quienes ya manejan este lenguaje.

Un archivo JSON puede representarse como:

jsonCopiarEditar{}

Ese ejemplo muestra un objeto vacío. Sin embargo, un archivo JSON puede contener desde un valor simple (como un número o una cadena de texto) hasta estructuras más complejas como listas u objetos anidados.

Aquí tienes un ejemplo más completo:

jsonCopiarEditar{
  "name": "Manz",
  "life": 3,
  "totalLife": 6,
  "power": 10,
  "dead": false,
  "props": ["invisibility", "coding", "happymood"],
  "senses": {
    "vision": 50,
    "audition": 75,
    "taste": 40,
    "touch": 80
  }
}

Aunque se parece mucho a un objeto de JavaScript, existen algunas diferencias importantes:

• Todas las claves deben ir entre comillas dobles.
• Las cadenas de texto también deben ir entre comillas dobles.
• Solo permite tipos como: number, string, boolean, null, array y object.
• No se pueden incluir funciones, fechas ni expresiones regulares.
• No admite comentarios, aunque existen variantes como JSON5 que sí los permiten.

Para verificar si un archivo está bien estructurado, puedes usar herramientas como JSONLint.

---

¿Cómo se usa JSON en JavaScript?

Dado que JSON se basa en la sintaxis de objetos de JavaScript, su integración es muy sencilla. Existen dos métodos fundamentales para trabajar con él:

Método	Función	Uso principal
JSON.parse()	Convierte una cadena JSON a un objeto JavaScript.
JSON.stringify()	Convierte un objeto JavaScript a texto JSON.

De texto a objeto (parseo)

Si tienes un string con contenido JSON, puedes convertirlo a un objeto con JSON.parse():

jsCopiarEditarconst data = `{
  "name": "Manz",
  "life": 99
}`;

const user = JSON.parse(data);

console.log(user.name); // "Manz"
console.log(user.life); // 99

De objeto a texto (stringify)

Si tienes un objeto en tu código y quieres convertirlo a formato JSON (por ejemplo, para enviarlo a un servidor), puedes usar JSON.stringify():

jsCopiarEditarconst player = {
  name: "Manz",
  life: 99
};

const jsonText = JSON.stringify(player);
console.log(jsonText); // '{"name":"Manz","life":99}'

También puedes especificar qué propiedades incluir y con cuántos espacios de indentación:

jsCopiarEditarJSON.stringify(player, ["name"], 2); // solo la propiedad "name"

---

Leer un archivo JSON externo

Aunque los ejemplos anteriores usan datos escritos directamente en el código, lo más habitual es cargar archivos .json desde servidores o recursos externos. Para eso, puedes usar fetch():

jsCopiarEditarfetch('data/player.json')
  .then(res => res.json())
  .then(data => {
    console.log(data.name); // Accede a los datos como si fuera un objeto
  });

Este tipo de uso es muy común en aplicaciones web que necesitan cargar configuraciones, datos de usuario, contenido dinámico u otros recursos sin recargar la página.

---

JSON es una herramienta esencial en el desarrollo moderno. Gracias a su simplicidad, compatibilidad con JavaScript y formato ligero, se ha convertido en el estándar de facto para el intercambio de datos entre sistemas y aplicaciones.