Convertir JSON a tipos de TypeScript — Numio
Genera interfaces o alias de tipo de TypeScript a partir de una muestra JSON, como la respuesta de una API. Se gestionan el anidamiento, null y los arrays mixtos, y la conversión se ejecuta en el navegador.
Crear tipos de TypeScript con nombre para la respuesta de una API.
Converted in your browser. Null stays a value type; ? marks a field missing from some objects in an array. Empty arrays use unknown elements.
JSON
TypeScript
Cuándo usarla
- Crear tipos de TypeScript con nombre para la respuesta de una API.
- Comparar varios objetos de un array para ver los tipos que difieren y los campos opcionales.
Cómo usarla
- Pega JSON real o carga uno de los ejemplos. Cargar un ejemplo sustituye tu entrada.
- Define el nombre del tipo raíz y elige interface (los objetos anidados pasan a tipos separados) o type (un único alias de tipo con los objetos anidados en línea).
- Revisa null, los campos opcionales (?) y las uniones string/number, y copia los tipos.
Entrada JSON
[{"id":1,"name":"Tokyo"},{"id":2}]Salida TypeScript (Root, interface)
export type Root = RootValueItem[];
export interface RootValueItem {
id: number;
name?: string;
}Detalles y limitaciones
Se inspeccionan todos los elementos del array. En el ejemplo, name falta en el segundo objeto, así que pasa a ser opcional; en cambio, un campo presente con null pasa a una unión con null.
Un array vacío da unknown[]. Los arrays mixtos pasan a arrays de un tipo unión, no a tuplas de longitud fija.
Los tipos solo cubren lo que aparece en la muestra. No se infieren los campos que nunca aparecen, los formatos de fecha o email, los rangos de valores ni las relaciones entre campos.
La entrada debe ser JSON estándar; limpia antes los comentarios o las comas finales con el formateador JSON. Introduce los IDs con ceros a la izquierda como cadenas.
La entrada está limitada a 1.000.000 de caracteres, unos 64 niveles y 50.000 valores. Los tipos de TypeScript no validan los datos en runtime.
FAQ
¿Genero una interface o un type?
Ambos describen la misma forma. interface crea una interface con nombre por cada objeto anidado, fácil de reutilizar; type crea un único alias de tipo con los objetos anidados escritos en línea.
¿Puede generar una clase de TypeScript?
No, solo genera interfaces o alias de tipo. Si necesitas validación en runtime, usa JSON a Zod y ajusta el esquema a tus reglas.
¿Qué diferencia hay entre null y un campo opcional?
{"name":null} tiene un name cuyo valor es null; {} no tiene name. null se mantiene en el tipo, y ? solo se añade cuando a algunos objetos del mismo array les falta el campo.
¿Qué produce un array JSON en la raíz?
Un alias de tipo para el array más una interface para sus elementos, como en el ejemplo de arriba, donde Root es RootValueItem[].