Entrada JSON

Saída TypeScript

O que é JSON para TypeScript?

TypeScript adiciona tipos estáticos ao JavaScript. Ao trabalhar com JSON de uma API ou arquivo de configuração, você frequentemente quer uma interface ou tipo que descreva a estrutura. Escrever manualmente é tedioso. Esta ferramenta infere interfaces TypeScript do seu JSON: analisa as chaves e valores e gera as definições de tipo correspondentes.

Cole seu JSON e obtenha TypeScript. A ferramenta roda no seu navegador. Nada é enviado a um servidor. A saída segue a sintaxe padrão do TypeScript.

Como usar esta ferramenta

1

Colar seu JSON

Cole JSON no editor esquerdo ou envie um arquivo. Use Amostra para dados de exemplo. O gerador infere tipos a partir da estrutura. Use dados representativos que mostrem todos os campos de interesse.

2

Revisar as interfaces

O painel direito mostra as interfaces geradas. Objetos aninhados têm suas próprias interfaces. Arrays são tipados como Type[]. Campos opcionais podem usar ? dependendo da implementação.

3

Copiar ou baixar

Use <strong>Copiar</strong> ou <strong>Baixar</strong> para obter o TypeScript. Cole no seu projeto. Pode ser necessário ajustar nomes, adicionar genéricos ou corrigir campos opcionais. Para validar JSON primeiro, use o Validador JSON.

Onde JSON para TypeScript ajuda

Na integração de API, tipos para payloads de resposta são frequentemente necessários. Cole uma resposta de exemplo aqui e obtenha interfaces que podem ser integradas em projetos Angular, React ou Node. Arquivos de configuração, payloads de webhook e documentos de banco de dados podem ser tratados da mesma forma. Escrever interfaces manualmente para estruturas aninhadas complexas é propenso a erros. Esta ferramenta infere a estrutura a partir da amostra. Para geração baseada em esquema, use o Gerador de esquema JSON e ferramentas como quicktype.

Exemplos de JSON para TypeScript

Exemplo de geração de interfaces TypeScript a partir de um objeto JSON.

Exemplo: Registro de assinante

Entrada JSON:

Entrada JSON

Saída TypeScript gerada:

Saída TypeScript

Limitações

O gerador infere a partir da amostra. Se um campo pode ser <code>string | number</code> mas a amostra só tem string, o tipo será <code>string</code>. Se um array pode estar vazio, o tipo do elemento pode ser <code>unknown</code>. Revise a saída e corrija. Para geração baseada em esquema, use o Gerador de esquema JSON e ferramentas como quicktype.

Perguntas frequentes

Campos opcionais são marcados?

Depende da implementação. Alguns geradores marcam todos os campos como obrigatórios, outros inferem da amostra. Revise a saída e adicione ? conforme necessário.

E tipos de união?

Se a mesma chave tem tipos diferentes em objetos diferentes, o gerador pode usar união como string | number. Ou pode escolher um tipo. Revise a saída.

Meus dados são enviados para algum lugar?

Não. A geração ocorre no seu navegador.

Posso gerar tipos para outras linguagens?

Esta ferramenta gera apenas TypeScript. Este site tem conversores para C#, Java, Python.

E enums?

Se um campo tem um conjunto fixo de valores de string, o gerador pode produzir um tipo de união como "a" | "b" | "c". Para enum explícito, edite a saída.

Ferramentas relacionadas

Para TypeScript, consulte typescriptlang.org e TypeScript objetos. Para JSON, consulte json.org e MDN JSON. Para geração de código a partir de esquema, consulte quicktype. RFC 8259 (especificação JSON) também.