JSON a TypeScript
Convertir JSON a interfaces TypeScript y generar definiciones de tipos
Entrada JSON
Salida TypeScript
¿Qué es JSON a TypeScript?
TypeScript añade tipos estáticos a JavaScript. Cuando trabajas con JSON de una API o archivo de configuración, a menudo quieres una interfaz o tipo que describa la estructura. Escribirlo a mano es tedioso. Esta herramienta infiere interfaces TypeScript desde tu JSON: analiza las claves y valores y genera las definiciones de tipo correspondientes.
Pega JSON, obtén TypeScript. La herramienta se ejecuta en tu navegador. No se envía nada a ningún servidor. La salida sigue la sintaxis estándar de TypeScript.
Cómo usar esta herramienta
Pegar JSON
Pega tu JSON en el editor izquierdo o sube un archivo. Usa Ejemplo para datos de ejemplo. El generador infiere tipos de la estructura. Usa datos representativos que muestren todos los campos que te interesan.
Revisar las interfaces
El panel derecho muestra las interfaces generadas. Los objetos anidados obtienen sus propias interfaces. Los arrays se tipan como Type[]. Los campos opcionales pueden usar ? según la implementación.
Copiar o descargar
Usa <strong>Copiar</strong> o <strong>Descargar</strong> para obtener el TypeScript. Pégalo en tu proyecto. Puede que necesites ajustar nombres, añadir genéricos o corregir campos opcionales. Para validar el JSON primero, usa el Validador JSON.
Dónde ayuda JSON a TypeScript
Al integrar APIs, a menudo necesitas tipos para el payload de respuesta. Pegar una respuesta de ejemplo aquí te da interfaces que puedes usar en tu proyecto Angular, React o Node. Archivos de configuración, payloads de webhooks y documentos de base de datos se benefician igual. Escribir interfaces manualmente para estructuras anidadas complejas es propenso a errores; esta herramienta infiere la estructura desde tu muestra. Para generación basada en esquema, usa el Generador de esquema JSON y herramientas como quicktype.
Ejemplos de JSON a TypeScript
Aquí un ejemplo de generación de interfaces TypeScript desde un objeto JSON.
Ejemplo: Registro de suscriptor
Entrada JSON:
Salida TypeScript generada:
Limitaciones
El generador infiere desde la muestra. Si un campo puede ser <code>string | number</code> pero tu muestra solo tiene strings, el tipo será <code>string</code>. Si los arrays pueden estar vacíos, el tipo de elemento puede ser <code>unknown</code>. Revisa y edita la salida. Para generación basada en esquema, usa el Generador de esquema JSON y una herramienta como quicktype.
Preguntas frecuentes
¿Se marcan los campos opcionales?
Depende de la implementación. Algunos generadores marcan todos los campos como requeridos; otros infieren desde la muestra. Revisa la salida y añade ? donde sea necesario.
¿Qué pasa con los tipos union?
Si la misma clave tiene diferentes tipos en distintos objetos, el generador puede usar string | number o una union similar. O puede elegir un tipo. Revisa la salida.
¿Se envían mis datos a algún sitio?
No. La generación se ejecuta en tu navegador.
¿Puedo generar tipos para otros lenguajes?
Esta herramienta solo genera TypeScript. El sitio tiene convertidores para C#, Java, Python y otros.
¿Qué pasa con los enums?
Si un campo tiene un conjunto fijo de valores string, el generador puede producir un tipo union como "a" | "b" | "c". Para enums explícitos, edita la salida.
Herramientas relacionadas
Para TypeScript, ver typescriptlang.org y objetos TypeScript. Para JSON, ver json.org y MDN JSON. Para generación de esquema a código, ver quicktype. Para RFC 8259 (especificación JSON).