Formateador/Validador JSON

Herramienta gratuita en línea para validar y formatear JSON.

?JSON을 입력하세요

들여쓰기 크기:2 spaces4 spaces8 spaces

📝 입력 JSON

줄: 0문자: 0크기: 0 bytes

✨ 결과

JSON (JavaScript Object Notation)의 유효성을 검사하고 포맷팅합니다. 들여쓰기를 추가하여 가독성을 높이거나, 공백을 제거하여 크기를 줄일 수 있습니다.

¿Qué es JSON?

JSON (JavaScript Object Notation) es un formato ligero de intercambio de datos. Es fácil de leer y escribir para humanos, y fácil de parsear y generar para máquinas. Se utiliza ampliamente en APIs web, archivos de configuración, almacenamiento de datos, etc.

Características principales

• Validación: Detección en tiempo real de errores de sintaxis JSON
• Formato (Prettify): Mejora la legibilidad añadiendo indentación
• Compresión (Minify): Reduce el tamaño eliminando espacios en blanco
• Estadísticas en tiempo real: Muestra número de líneas, caracteres y tamaño en bytes
• Configuración de indentación: Elige entre 2/4/8 espacios
• Cargar muestra: Prueba rápida con JSON de ejemplo

Modo de uso

Validación JSON

1. Pega tu JSON en el área de entrada
2. La validación se realiza en tiempo real
3. Si hay errores, se muestra un mensaje detallado

Formatear JSON

1. Ingresa tu JSON
2. Selecciona el tamaño de indentación (2/4/8 espacios)
3. Haz clic en el botón "Formatear"
4. Se muestra el JSON ordenado

Comprimir JSON

1. Ingresa tu JSON
2. Haz clic en el botón "Comprimir"
3. Se muestra el JSON en una línea sin espacios

Sintaxis básica de JSON

Tipos de datos

1. Objeto (Object)

{
  "name": "John",
  "age": 30
}

2. Array (Array)

["apple", "banana", "orange"]

3. Cadena (String)

"Hello World"

4. Número (Number)

42
3.14
-10

5. Booleano (Boolean)

true
false

6. null

null

Estructura anidada

{
  "user": {
    "name": "John Doe",
    "age": 30,
    "emails": ["john@example.com", "doe@example.com"],
    "address": {
      "city": "New York",
      "country": "USA"
    },
    "active": true,
    "lastLogin": null
  }
}

Errores comunes de JSON

1. Coma final (Trailing Comma)

// ❌ Incorrecto
{
  "name": "John",
  "age": 30,  ← Coma final
}

// ✅ Correcto
{
  "name": "John",
  "age": 30
}

2. Comillas faltantes

// ❌ Incorrecto
{
  name: "John"  ← Sin comillas en la clave
}

// ✅ Correcto
{
  "name": "John"
}

3. Uso de comillas simples

// ❌ Incorrecto
{
  'name': 'John'  ← Comillas simples
}

// ✅ Correcto
{
  "name": "John"
}

4. Uso de comentarios

// ❌ Incorrecto
{
  // Este es un comentario
  "name": "John"
}

// ✅ JSON no admite comentarios
// Necesita usar JSONC o JSON5

5. Valores indefinidos

// ❌ Incorrecto
{
  "name": "John",
  "age": undefined  ← undefined no existe en JSON
}

// ✅ Correcto (usar null)
{
  "name": "John",
  "age": null
}

Casos de uso

1. Depuración de respuestas API

// Formatear respuesta de API para verificar
{
  "status": "success",
  "data": {
    "users": [
      {"id": 1, "name": "John"},
      {"id": 2, "name": "Jane"}
    ]
  }
}

2. Creación de archivos de configuración

// package.json, tsconfig.json, etc.
{
  "name": "my-app",
  "version": "1.0.0",
  "dependencies": {
    "react": "^18.0.0"
  }
}

3. Almacenamiento de datos

// Local storage, guardado de archivos, etc.
{
  "theme": "dark",
  "language": "es",
  "notifications": true
}

4. Análisis de registros

// Registros estructurados
{
  "timestamp": 1640995200,
  "level": "error",
  "message": "Connection failed",
  "details": {
    "host": "api.example.com",
    "port": 443
  }
}

5. Datos de prueba

// Generación de datos mock
{
  "users": [
    {"id": 1, "name": "Test User 1"},
    {"id": 2, "name": "Test User 2"}
  ]
}

Uso por lenguaje de programación

JavaScript

// JSON → Objeto (parseo)
const obj = JSON.parse('{"name":"John","age":30}');
console.log(obj.name); // "John"

// Objeto → JSON (stringificación)
const json = JSON.stringify(obj);
console.log(json); // '{"name":"John","age":30}'

// Formato (indentación 2 espacios)
const formatted = JSON.stringify(obj, null, 2);

Python

import json

# JSON → Diccionario
data = json.loads('{"name":"John","age":30}')
print(data['name'])  # "John"

# Diccionario → JSON
json_str = json.dumps(data)

# Formato
formatted = json.dumps(data, indent=2)

PHP

<?php
// JSON → Array
$data = json_decode('{"name":"John","age":30}', true);
echo $data['name'];  // "John"

// Array → JSON
$json = json_encode($data);

// Formato
$formatted = json_encode($data, JSON_PRETTY_PRINT);
?>

Java

import com.google.gson.Gson;
import com.google.gson.GsonBuilder;

// JSON → Objeto
Gson gson = new Gson();
User user = gson.fromJson(jsonString, User.class);

// Objeto → JSON
String json = gson.toJson(user);

// Formato
Gson prettyGson = new GsonBuilder().setPrettyPrinting().create();
String formatted = prettyGson.toJson(user);

C#

using System.Text.Json;

// JSON → Objeto
var user = JsonSerializer.Deserialize<User>(jsonString);

// Objeto → JSON
var json = JsonSerializer.Serialize(user);

// Formato
var options = new JsonSerializerOptions { WriteIndented = true };
var formatted = JsonSerializer.Serialize(user, options);

Formato vs Compresión

Formato (Prettify)

Ventajas:

• Fácil de leer para humanos
• Facilita la depuración
• Fácil comprensión de la estructura

Desventajas:

• Aumenta el tamaño del archivo
• Ineficiente para transmisión por red

Cuándo usar:

• Desarrollo/depuración
• Archivos de configuración
• Documentación

Compresión (Minify)

Ventajas:

• Reduce el tamaño del archivo (aprox. 30-50%)
• Eficiente para transmisión por red
• Ahorra espacio de almacenamiento

Desventajas:

• Difícil de leer para humanos
• Dificulta la depuración

Cuándo usar:

• Entorno de producción
• Respuestas API
• Datos de gran volumen

Consejos prácticos

1. Procesamiento de archivos JSON grandes

// Usar parseo por streaming
const stream = fs.createReadStream('large.json');
const parser = JSONStream.parse('*');
stream.pipe(parser);

2. Manejo de referencias circulares

const obj = {};
obj.self = obj; // Referencia circular

// Ocurre error
// JSON.stringify(obj); // TypeError

// Resolver con replacer personalizado
const json = JSON.stringify(obj, (key, value) => {
  if (key === 'self') return undefined;
  return value;
});

3. Manejo de objetos Date

const data = {
  name: "John",
  created: new Date()
};

// Date → Cadena ISO 8601
const json = JSON.stringify(data);
// {"name":"John","created":"2022-01-01T00:00:00.000Z"}

4. Serializar solo campos específicos

const user = {
  name: "John",
  password: "secret",
  age: 30
};

// Excluir password
const json = JSON.stringify(user, ['name', 'age']);
// {"name":"John","age":30}

5. Comparación antes y después de comprimir

const data = { /* objeto complejo */ };

const formatted = JSON.stringify(data, null, 2);
console.log(formatted.length); // 1500

const minified = JSON.stringify(data);
console.log(minified.length); // 850

// ¡Reducción de aproximadamente 43%!

JSON vs otros formatos

JSON vs XML

Característica	JSON	XML
Legibilidad	Más conciso	Más verboso
Velocidad de parseo	Rápido	Lento
Tipos de datos	Soporte nativo	Solo cadenas
Atributos	No	Sí
Comentarios	No	Sí

JSON vs YAML

Característica	JSON	YAML
Legibilidad	Media	Muy buena
Sintaxis	Estricta	Flexible
Comentarios	No	Sí
Estructuras complejas	Posible	Más fácil
Velocidad de parseo	Rápido	Lento

Preguntas frecuentes

P: ¿Se pueden agregar comentarios en JSON?

JSON estándar no admite comentarios. Alternativas:

• JSONC: JSON con soporte de comentarios usado en VS Code, etc.
• JSON5: Admite comentarios estilo JavaScript

P: ¿Cuál es el tamaño máximo de JSON?

No hay límite teórico, pero prácticamente:

• Navegador: Aprox. 10-100 MB (varía según el navegador)
• Node.js: Aprox. 512 MB (valor predeterminado del motor V8)
• Límite de memoria: Depende de la memoria del sistema

P: ¿Cómo se representan las fechas en JSON?

Método estándar es cadena ISO 8601:

{"date": "2022-01-01T00:00:00.000Z"}

P: ¿Cuál es la diferencia entre undefined y null en JSON?

• null: Valor válido en JSON
• undefined: No compatible con JSON (se omite o convierte a null)

P: ¿Formatear afecta el rendimiento?

Se vuelve ligeramente más lento pero es despreciable. Se recomienda usar formato durante el desarrollo y compresión en producción.

P: ¿Qué hacer si hay BOM en el archivo JSON?

Se debe eliminar el BOM (Byte Order Mark):

const json = text.replace(/^\uFEFF/, '');

Herramientas relacionadas

• Codificador Base64 - Codificar JSON a Base64
• Codificador URL - Codificar JSON de forma segura en URL
• Comparación de texto - Comparar dos JSON

Rendimiento

• Velocidad de parseo: Menos de un milisegundo (tamaño normal)
• Velocidad de formato: Instantánea
• Velocidad de compresión: Instantánea
• Uso de memoria: Mínimo

Compatibilidad del navegador

JSON.parse() y JSON.stringify() son compatibles con todos los navegadores modernos:

• Chrome (todas las versiones) ✓
• Firefox (todas las versiones) ✓
• Safari (todas las versiones) ✓
• Edge (todas las versiones) ✓
• IE 8+ ✓

Privacidad

Esta herramienta funciona completamente del lado del cliente. El JSON que ingresas no se envía al servidor y solo se procesa en tu navegador.

🔗 Prueba a continuación

• Codificador Base64 - Codificar JSON a Base64
• Conversor CSV-JSON - Convertir entre CSV y JSON
• Probador API - Probar endpoints REST API
• Codificador URL - Codificar JSON de forma segura en URL

💬 ¿Te ha sido útil esta herramienta?

Si tienes preguntas o sugerencias de mejora, ¡no dudes en darnos tu opinión!