PT

JSON para TypeScript

Cole um JSON e receba interfaces ou type aliases do TypeScript. Campos opcionais ganham ponto de interrogação, valores null acrescentam | null e listas com valores misturados viram union types.

Grátis e privado. Tudo funciona no seu navegador e nada é enviado.

Como funciona

  1. Cole o seu JSONCole uma resposta da sua API ou abra um arquivo .json. Use Exemplo para ver como funciona.
  2. Ajuste as opçõesDefina o nome do tipo principal e as opções desta linguagem. O código se atualiza enquanto você digita.
  3. Copie ou baixeCopie o código para o seu projeto ou baixe como arquivo.

Interfaces para respostas de API

Tipar a resposta de uma chamada fetch é uma das tarefas mais comuns num projeto TypeScript. Cole aqui uma resposta real e você recebe uma interface para cada formato de objeto, com objetos e listas aninhados tipados até o fim. Chaves que não são identificadores válidos, como "Created At" ou "123abc", ficam entre aspas para que o tipo continue batendo com os dados.

Escolha interface ou type, se todos os tipos são exportados e se os campos são somente leitura. Datas continuam como string, porque o JSON não tem tipo de data e JSON.parse devolve textos. Um campo que é null em todos os itens vira unknown, então o compilador obriga você a verificá-lo antes de usar.

Perguntas frequentes

Interface ou type, qual escolher?

Os dois servem para formatos de objeto. Interfaces podem ser estendidas e mescladas, type aliases também descrevem unions. Muitas equipes usam interfaces para modelos de API, por isso é o padrão.

Meu JSON é enviado para algum lugar?

Não. Os tipos são gerados no seu navegador. Respostas de API com dados de clientes ou chaves nunca saem do seu dispositivo.

Como os campos opcionais são detectados?

Se o JSON tem uma lista de objetos, todos os objetos são comparados. Um campo que falta em pelo menos um objeto é marcado como opcional. Com um único objeto, todos os campos são tratados como obrigatórios.

O que acontece com campos que são sempre null?

Não dá para saber o tipo pelo exemplo, então o campo recebe um tipo genérico como unknown, object, Any ou JsonElement. Inclua um exemplo em que o campo tenha valor para obter um tipo preciso.

Por que o meu 1.0 virou número decimal?

A ferramenta olha como o número está escrito. 1.0 ou 2.5 viram double ou float, 1 vira inteiro. Se um campo é inteiro em alguns itens e decimal em outros, o tipo decimal é usado.

Posso usar o resultado em código de produção?

Sim, o código compila como está nas configurações mais comuns. Revise nomes e tipos antes do commit, porque um exemplo nunca mostra todos os valores possíveis.

Funciona sem internet?

Sim. Depois que você abre a página uma vez, ela continua funcionando sem conexão com a internet.