🏠 Menú ⭐ NIVEL 20 ⬅️ Anterior

📦 JSON - El Idioma de los Datos

🤔 ¿Qué es JSON?

JSON = JavaScript Object Notation

JSON es un formato para guardar y enviar datos. Es como una lista organizada que tanto humanos como computadoras pueden leer fácilmente.

JSON se usa para:

📝 Sintaxis de JSON

✅ JSON Válido

{
  "nombre": "María",
  "edad": 12,
  "estudiante": true
}

❌ JSON Inválido

{
  nombre: "María",  // Falta ""
  'edad': 12,       // Usa ""
  edad: 12,         // Coma final
}
Reglas de JSON:
• Las claves siempre van con comillas dobles "clave"
• Los strings usan comillas dobles, no simples
• No se permiten comas finales
• No se permiten comentarios

📊 Tipos de Datos en JSON

{
  "texto": "Hola Mundo",           // String
  "numero": 42,                       // Number
  "decimal": 3.14,                    // Number
  "verdadero": true,                 // Boolean
  "falso": false,                     // Boolean
  "nulo": null,                       // Null
  "lista": [1, 2, 3],                  // Array
  "objeto": { "a": 1 }               // Object
}

🔧 Métodos JSON en JavaScript

Método ¿Qué hace? Ejemplo
JSON.parse() Convierte texto JSON → Objeto JS JSON.parse('{"a":1}')
JSON.stringify() Convierte Objeto JS → texto JSON JSON.stringify({a:1})

📥 JSON.parse() - Texto a Objeto

// Tenemos un texto JSON (como viene de una API)
const textoJSON = '{"nombre": "Carlos", "edad": 10}';

// Lo convertimos a objeto JavaScript
const objeto = JSON.parse(textoJSON);

console.log(objeto.nombre);  // "Carlos"
console.log(objeto.edad);    // 10

📤 JSON.stringify() - Objeto a Texto

// Tenemos un objeto JavaScript
const persona = {
    nombre: "Ana",
    edad: 15,
    hobbies: ["leer", "programar"]
};

// Lo convertimos a texto JSON
const texto = JSON.stringify(persona);

console.log(texto);
// '{"nombre":"Ana","edad":15,"hobbies":["leer","programar"]}'
¿Cuándo usar cada uno?
• parse(): Cuando recibes datos (de API, localStorage, archivo)
• stringify(): Cuando envías datos o los guardas

💻 Editor - Practica con JSON

📝 JavaScript
📋 Consola
Haz clic en "▶️ Ejecutar" para ver el resultado

💾 JSON + LocalStorage

JSON es perfecto para guardar datos complejos en localStorage:

// Guardar un array de tareas
const tareas = [
    { id: 1, texto: "Aprender JSON", completada: true },
    { id: 2, texto: "Hacer ejercicios", completada: false }
];

// Guardar (convertir a texto)
localStorage.setItem('misTareas', JSON.stringify(tareas));

// Recuperar (convertir a objeto)
const tareasGuardadas = JSON.parse(
    localStorage.getItem('misTareas')
);

console.log(tareasGuardadas[0].texto); // "Aprender JSON"

🎯 Quiz - ¡Demuestra lo que Aprendiste!

1. ¿Qué significa JSON?

Java Simple Object Notation
JavaScript Object Notation
JavaScript Online Network

2. ¿Qué método convierte texto JSON a objeto JavaScript?

JSON.parse()
JSON.stringify()
JSON.convert()

3. En JSON, ¿qué tipo de comillas se usan para las claves?

Comillas simples ''
Comillas dobles ""
Sin comillas

4. ¿Cuál es JSON válido?

{nombre: "Ana"}
{'nombre': 'Ana'}
{"nombre": "Ana"}
⭐ ⭐ ⭐