Saltar al contenido
es
Todas las herramientas

Categorías

Herramientas para desarrolladoresCodificación y decodificaciónJSON y datosHash y checksumHerramientas de textoFecha y horaHerramientas de redHerramientas de archivosMarkdown y diagramas

JSON a TypeScript

Pegue un ejemplo de JSON y obtenga declaraciones TypeScript listas para usar que describen su forma.

Procesado localmente en tu navegador

Opciones
0 caracteres · 0 líneas
El resultado aparecerá aquí.

¿Qué es JSON a TypeScript?

Al consumir una API JSON en TypeScript necesita tipos para las respuestas. Escribirlos a mano para cargas grandes es lento y propenso a errores, así que un generador que los infiere de un ejemplo real ahorra tiempo.

Esta herramienta recorre su JSON, crea una interfaz con nombre (o un alias de tipo) para cada objeto anidado, fusiona los objetos de un arreglo para que las claves ausentes en algunos elementos pasen a ser opcionales (?) y construye uniones cuando un campo contiene tipos distintos. Puede elegir el nombre raíz, el estilo interface o type, la palabra clave export y las propiedades de solo lectura.

¿Cómo funciona?

  1. Pegue un ejemplo JSON representativo, idealmente con varios elementos de arreglo para detectar campos opcionales.
  2. Defina el nombre del tipo raíz y elija interface o type, export y solo lectura.
  3. Revise las declaraciones generadas en la salida.
  4. Cópielas en su proyecto o descargue types.ts.

Casos de uso habituales

  • Tipar la respuesta de un endpoint REST antes de escribir el código cliente.
  • Modelar un archivo de configuración o una carga de webhook.
  • Obtener un primer borrador de tipos para una API heredada sin documentación.
  • Comprobar qué campos de una respuesta faltan o son null a veces.

Ejemplos

Prueba esta entrada en la herramienta de arriba:

Entrada
{"id":1,"name":"Ada","email":null,"tags":["math","code"],"profile":{"age":36,"admin":false},"orders":[{"sku":"A1","qty":2,"note":"gift"},{"sku":"B2","qty":1}]}
Salida
export interface Root {
  id: number;
  name: string;
  email: null;
  tags: string[];
  profile: Profile;
  orders: Order[];
}

export interface Profile {
  age: number;
  admin: boolean;
}

export interface Order {
  sku: string;
  qty: number;
  note?: string;
}

Privacidad

JSON a TypeScript se ejecuta por completo en tu navegador. El texto o los archivos que proporcionas se procesan en tu dispositivo y no se suben, registran ni almacenan en nuestros servidores.

Limitaciones

Los tipos se infieren de un solo ejemplo: un campo siempre presente en su muestra puede ser opcional en la realidad, y las fechas llegan como string. Revise antes de confirmar.

Preguntas frecuentes

¿Cómo se detectan las propiedades opcionales?

Cuando se fusionan varios objetos (por ejemplo los elementos de un arreglo), una clave ausente en al menos uno se marca como opcional con un signo de interrogación. Una clave presente pero con valor null conserva una unión con null.

¿Cómo se nombran los objetos anidados?

Cada objeto anidado recibe una interfaz con el nombre de su clave en PascalCase (orders pasa a Order para los elementos del arreglo). Los objetos con estructura idéntica reutilizan la misma declaración y las colisiones de nombre reciben un sufijo numérico.

¿Se gestionan enteros grandes y fechas?

Todos los números JSON pasan a number y las fechas a string, porque JSON no tiene tipo fecha. Ajuste esos tipos a mano si su código los convierte en Date o bigint.

Herramientas relacionadas

Más herramientas en JSON y datos →