JSON a TypeScript
Convierte automáticamente datos JSON a interfaces o definiciones de tipo TypeScript
// Las definiciones de tipo TypeScript se generarán automáticamente¿Qué es JSON a TypeScript?
JSON a TypeScript es una herramienta que convierte automáticamente datos JSON a definiciones de tipo TypeScript. Analiza la estructura JSON y genera declaraciones de interface o type correspondientes, ayudando a los desarrolladores a lograr seguridad de tipos y sugerencias de código en proyectos TypeScript.
Cómo Usar
- Pega datos JSON en el cuadro de entrada izquierdo, o haz clic en el botón de ejemplo para cargar uno
- Configura las opciones: establece el nombre del tipo raíz, elige el estilo interface/type, si agregar export, etc.
- Las definiciones de tipo TypeScript correspondientes se generan automáticamente a la derecha
- Haz clic en el botón 'Copiar' para copiar las definiciones de tipo generadas al portapapeles
- Pega las definiciones de tipo en tu proyecto TypeScript para usarlas
Ejemplos
Conversión de Objeto Simple
输入 JSON:
{
"name": "张三",
"age": 28,
"isActive": true
}
输出 TypeScript:
export interface Root {
name: string;
age: number;
isActive: boolean;
}Conversión de Objeto Anidado
输入 JSON:
{
"user": {
"id": 1,
"profile": {
"avatar": "url",
"bio": "简介"
}
}
}
输出 TypeScript:
export interface UserProfile {
avatar: string;
bio: string;
}
export interface User {
id: number;
profile: UserProfile;
}
export interface Root {
user: User;
}Preguntas Frecuentes
Q: ¿Cómo uso los tipos generados?
A: Copia las definiciones de tipo generadas a un archivo .ts, luego úsalas en tu código. Por ejemplo: const data: Root = JSON.parse(response)
Q: ¿Cuál es la diferencia entre interface y type?
A: interface puede ser extendido e implementado, adecuado para definir tipos de objeto; type es más flexible y puede definir tipos de unión, tipos de intersección, etc. Para estructuras de objeto simples, ambos funcionan de manera similar.
Q: ¿Cómo se manejan los JSON de tipo array?
A: La herramienta reconoce automáticamente los tipos de elementos del array. Para arrays de objetos, se generan definiciones de tipo separadas para los elementos del array, luego se representan usando ItemType[].
Q: ¿Se pueden editar los tipos generados?
A: Sí, se pueden editar libremente después de la generación. Recomendamos ajustar los nombres de los tipos, agregar marcadores de campo opcional (?), o modificar las definiciones de tipo de algunos campos según sea necesario.