Converter JSON em tipos TypeScript — Numio
Gere interfaces ou aliases de tipo TypeScript a partir de uma amostra JSON, como a resposta de uma API. Aninhamento, null e arrays mistos são tratados, e a conversão roda no navegador.
Criar tipos TypeScript nomeados para a resposta de uma 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
Quando usar
- Criar tipos TypeScript nomeados para a resposta de uma API.
- Comparar vários objetos de um array para ver tipos diferentes e campos opcionais.
Como usar
- Cole um JSON real ou carregue um dos exemplos. Carregar um exemplo substitui sua entrada.
- Defina o nome do tipo raiz e escolha interface (objetos aninhados viram tipos separados) ou type (um único alias de tipo com os objetos aninhados inline).
- Confira null, campos opcionais (?) e uniões string/number, depois copie os tipos.
Entrada JSON
[{"id":1,"name":"Tokyo"},{"id":2}]Saída TypeScript (Root, interface)
export type Root = RootValueItem[];
export interface RootValueItem {
id: number;
name?: string;
}Detalhes e limitações
Todos os elementos do array são inspecionados. No exemplo, name está ausente do segundo objeto, então vira opcional; já um campo presente com null vira uma união com null.
Um array vazio gera unknown[]. Arrays mistos viram arrays de um tipo união, não tuplas de tamanho fixo.
Os tipos cobrem só o que aparece na amostra. Campos que nunca aparecem, formatos de data ou e-mail, intervalos de valores e relações entre campos não são inferidos.
A entrada precisa ser JSON padrão; limpe antes comentários ou vírgulas finais com o formatador JSON. Informe IDs com zeros à esquerda como strings.
A entrada é limitada a 1.000.000 de caracteres, cerca de 64 níveis e 50.000 valores. Tipos TypeScript não validam dados em runtime.
FAQ
Devo gerar uma interface ou um type?
Os dois descrevem o mesmo formato. interface cria uma interface nomeada para cada objeto aninhado, fácil de reutilizar; type cria um único alias de tipo com os objetos aninhados escritos inline.
Ele gera uma classe TypeScript?
Não, gera apenas interfaces ou aliases de tipo. Se precisar de validação em runtime, use JSON para Zod e ajuste o esquema às suas regras.
Qual a diferença entre null e um campo opcional?
{"name":null} tem um name cujo valor é null; {} não tem name. null permanece no tipo, e ? só é adicionado quando alguns objetos do mesmo array não têm o campo.
O que um array JSON na raiz gera?
Um alias de tipo para o array mais uma interface para os itens, como no exemplo acima, em que Root é RootValueItem[].