JSON para TypeScript
Gere interfaces de TypeScript a partir de uma amostra JSON.
Seu JSON é analisado e convertido inteiramente no seu navegador, então ele permanece no seu dispositivo e nada é enviado para um servidor.
Precisa de tipos Go, Rust ou Python? Experimente o JSON para Código.
Sobre JSON para TypeScript
Este conversor de json para typescript transforma um objeto ou array JSON de exemplo em interfaces TypeScript prontas para uso em segundos. Cole uma resposta de API real e ele infere os tipos dos campos, aninha objetos filhos em suas próprias interfaces nomeadas, mescla arrays de objetos em um único formato e marca como opcionais, com um ponto de interrogação, as chaves ausentes em alguns itens. Foi feito para desenvolvedores frontend e backend, engenheiros de QA e qualquer pessoa montando clientes tipados que prefere gerar tipos typescript a partir de json a escrevê-los à mão. Use-o como um gerador de interface typescript rápido enquanto explora um endpoint desconhecido, ou para manter seus modelos em sincronia com payloads de exemplo. Tudo roda localmente no seu navegador, então o JSON que você cola é processado no seu dispositivo e nada é enviado para um servidor.
Recursos
- Gera interfaces TypeScript nomeadas a partir de qualquer objeto ou array JSON
- Transforma objetos aninhados em suas próprias interfaces exportadas com nomes em PascalCase
- Mescla arrays de objetos em uma única interface que cobre todas as chaves
- Marca como opcionais, com um ponto de interrogação, as chaves ausentes em alguns elementos
- Infere tipos primitivos, de array, de união e null a partir dos seus valores de exemplo
- Permite renomear a interface raiz para combinar com o seu modelo
- Valida o JSON e aponta a linha e coluna dos erros de sintaxe
- Copie o resultado ou baixe-o como um arquivo .ts
Como usar JSON para TypeScript
- Cole seu objeto ou array JSON na caixa de entrada.
- Defina o nome da interface raiz para combinar com o seu modelo, ou deixe como Root.
- Revise as interfaces TypeScript geradas no painel de saída.
- Copie o resultado ou baixe-o como um arquivo .ts.
Exemplo
Entrada
{ "id": 1, "name": "Ada", "tags": ["a", "b"] }
Saída
export interface Root {
id: number;
name: string;
tags: string[];
}
Um objeto JSON plano vira uma única interface tipada.
Erros comuns e solução de problemas
- A saída mostra um erro Invalid com uma linha e coluna. — O JSON tem um problema de sintaxe, como uma vírgula sobrando, aspas simples ou uma chave sem aspas. Corrija na linha e coluna informadas e as interfaces serão geradas novamente.
- Um campo que você esperava está marcado como opcional com um ponto de interrogação. — Essa chave está ausente em pelo menos um elemento do seu array de exemplo. Inclua-a em todos os elementos se ela deve sempre ser obrigatória.
- Uma propriedade sai como o tipo unknown. — Todos os valores de exemplo para essa chave eram null ou undefined, então nenhum tipo concreto pôde ser inferido. Forneça um exemplo com um valor real para esse campo.
- Colar um valor avulso como um número ou string gera apenas um alias de tipo. — Isso é esperado. Envolva o valor em um objeto ou array se você quiser uma interface nomeada em vez de um único export type alias.
Perguntas frequentes
- O que é o conversor de JSON para TypeScript?
- É uma ferramenta que lê um objeto ou array JSON de exemplo e gera interfaces TypeScript correspondentes, inferindo o tipo de cada campo para que você coloque o resultado diretamente no seu código.
- Como converto JSON para interfaces TypeScript?
- Cole seu JSON na caixa de entrada, opcionalmente defina o nome da interface raiz e depois copie ou baixe as interfaces geradas no painel de saída.
- Como o JSON para TypeScript lida com arrays de objetos?
- Ele mescla as chaves de todos os elementos em uma única interface. Qualquer chave ausente em alguns elementos é marcada como opcional com um ponto de interrogação para que o tipo cubra o array inteiro.
- Como objetos aninhados são convertidos para TypeScript?
- Cada objeto aninhado vira sua própria interface exportada com um nome em PascalCase, e o pai a referencia por tipo em vez de inserir o formato inline.
- O que acontece com valores null ou de tipos mistos?
- Valores null produzem uma união com null, e campos que armazenam mais de um tipo primitivo viram uma união como string | number.
- Meu JSON é enviado para algum lugar quando o converto para TypeScript?
- Não. A conversão de JSON para TypeScript roda inteiramente no seu navegador, então os dados que você cola são processados localmente e nunca saem do dispositivo.
Ferramentas relacionadas
Todas as ferramentas de ArrayKit