JSON a TypeScript: Interfaces al instante

Convierte JSON a TypeScript en interfaces desde cualquier objeto o arreglo de muestra.

Tu JSON se analiza y se convierte por completo en tu navegador, así que se queda en tu dispositivo y nada se sube a un servidor.

Creado y mantenido por Udit Agarwal

¿Necesitas tipos de Go, Rust o Python? Prueba JSON a Código.

Acerca de JSON a TypeScript

Este conversor de json a typescript convierte un objeto o arreglo JSON de muestra en interfaces de TypeScript listas para usar en segundos. Pega una respuesta de API real e infiere los tipos de los campos, anida los objetos hijos en sus propias interfaces nombradas, fusiona arreglos de objetos en una sola forma y marca como opcionales con un signo de interrogación las claves que faltan en algunos elementos. Está hecho para personas desarrolladoras de frontend y backend, equipos de QA y cualquiera que conecte clientes tipados y prefiera generar tipos de typescript desde json en lugar de escribirlos a mano. Úsalo como un generador de interfaces typescript rápido mientras exploras un endpoint desconocido, o para mantener tus modelos sincronizados con los payloads de muestra. Todo se ejecuta localmente en tu navegador, así que el JSON que pegas se procesa en tu dispositivo y nada se sube a un servidor.

Características

  • Genera interfaces de TypeScript nombradas desde cualquier objeto o arreglo JSON
  • Convierte los objetos anidados en sus propias interfaces exportadas con nombres en PascalCase
  • Fusiona arreglos de objetos en una sola interfaz que cubre todas las claves
  • Marca como opcionales con un signo de interrogación las claves que faltan en algunos elementos
  • Infiere tipos primitivos, de arreglo, de unión y null a partir de tus valores de muestra
  • Te permite renombrar la interfaz raíz para que coincida con tu modelo
  • Valida el JSON y señala la línea y columna de los errores de sintaxis
  • Copia el resultado o descárgalo como un archivo .ts

Cómo usar JSON a TypeScript

  1. Pega tu objeto o arreglo JSON en el cuadro de entrada.
  2. Establece el nombre de la interfaz raíz para que coincida con tu modelo, o déjalo como Root.
  3. Revisa las interfaces de TypeScript generadas en el panel de salida.
  4. Copia el resultado o descárgalo como un archivo .ts.

Ejemplo

Entrada

{ "id": 1, "name": "Ada", "tags": ["a", "b"] }

Salida

export interface Root {
  id: number;
  name: string;
  tags: string[];
}

Un objeto JSON plano se convierte en una sola interfaz tipada.

Errores comunes y solución de problemas

  • La salida muestra un error de Inválido con una línea y columna. — El JSON tiene un problema de sintaxis como una coma final, comillas simples o una clave sin comillas. Corrígelo en la línea y columna reportadas y las interfaces se regenerarán.
  • Un campo que esperabas está marcado como opcional con un signo de interrogación. — Esa clave está ausente en al menos un elemento de tu arreglo de muestra. Inclúyela en cada elemento si siempre debe ser obligatoria.
  • Una propiedad sale con el tipo unknown. — Todos los valores de muestra de esa clave eran null o undefined, así que no se pudo inferir un tipo concreto. Proporciona una muestra con un valor real para ese campo.
  • Pegar un valor suelto como un número o string solo produce un alias de tipo. — Eso es lo esperado. Envuelve el valor en un objeto o arreglo si quieres una interfaz nombrada en lugar de un solo export type alias.

Preguntas frecuentes

¿Qué es el conversor de JSON a TypeScript?
Es una herramienta que lee un objeto o arreglo JSON de muestra y genera interfaces de TypeScript que coinciden, infiriendo el tipo de cada campo para que puedas pegar el resultado directamente en tu código.
¿Cómo convierto JSON a interfaces de TypeScript?
Pega tu JSON en el cuadro de entrada, opcionalmente establece el nombre de la interfaz raíz y luego copia o descarga las interfaces generadas desde el panel de salida.
¿Cómo maneja JSON a TypeScript los arreglos de objetos?
Fusiona las claves de todos los elementos en una sola interfaz. Cualquier clave que falte en algunos elementos se marca como opcional con un signo de interrogación para que el tipo cubra todo el arreglo.
¿Cómo se convierten los objetos anidados a TypeScript?
Cada objeto anidado se convierte en su propia interfaz exportada con un nombre en PascalCase, y el padre la referencia por tipo en lugar de incluir la forma en línea.
¿Qué pasa con los valores null o de tipo mixto?
Los valores null producen una unión con null, y los campos que contienen más de un tipo primitivo se convierten en una unión como string | number.
¿Mi JSON se envía a algún lugar cuando lo convierto a TypeScript?
No. La conversión de JSON a TypeScript se ejecuta por completo en tu navegador, así que los datos que pegas se procesan localmente y nunca salen de tu dispositivo.

Herramientas relacionadas

Más herramientas de JSON

  • JSON a CSV — Convierte un arreglo de objetos JSON planos a CSV.
  • Escapar / Desescapar JSON — Escapa texto a una cadena JSON o desescapa una cadena JSON a texto sin formato.
  • JSON a código — Genera tipos de Go, Rust, Python, Java, Kotlin, C# y TypeScript a partir de JSON.
  • JSON Diff — Compara dos documentos JSON con un diff estructural por rutas.
  • JSON Schema — Genera un JSON Schema desde una muestra o valida un documento JSON contra uno.
  • JSON Flatten / Unflatten — Aplana JSON anidado a claves con notación de puntos, o vuelve a anidarlo.
  • JSON a Zod — Genera un esquema de Zod a partir de una muestra JSON.
  • JSON a Pydantic — Genera clases de modelo Pydantic v2 a partir de una muestra JSON.
  • Evaluador de JSONPath — Prueba expresiones JSONPath contra tu JSON y ve las coincidencias en vivo.
  • JSON a TOON — Convierte JSON a TOON para usar menos tokens en los prompts de LLM.
  • jq Playground — Ejecuta filtros jq contra JSON con el motor jq real, todo en tu navegador.
  • TypeScript a mock JSON — Genera mock JSON realista que se ajusta a una interfaz o tipo de TypeScript.

Ver todas las herramientas de JSON (29) · Todas las herramientas