Conversor de JSON para TypeScript

Cole uma resposta de API e receba interfaces ou type aliases TypeScript prontos para usar, com tipos aninhados, campos opcionais e uniões com null deduzidos para você.

Roda no seu navegadorSem cadastroNada é enviado

TypeScript

Como usar: JSON para TypeScript

  1. Cole um exemplo de JSON, como uma resposta de API, na caixa da esquerda ou abra um arquivo .json.
  2. Defina o nome do tipo raiz (por exemplo User ou ApiResponse).
  3. Escolha declarações interface ou type e ative export, readonly ou campos todos opcionais.
  4. Escolha unknown (mais seguro) ou any para valores que o exemplo não consegue revelar, como arrays vazios e nulls.
  5. Copie o código gerado ou baixe-o como arquivo .ts.

Como os tipos são deduzidos

  • Primitivos: strings, números e booleanos viram string, number e boolean.
  • Objetos aninhados viram interfaces próprias nomeadas em PascalCase, então billing_address vira BillingAddress.
  • Arrays de objetos são mesclados em um único tipo de item, nomeado no singular: users gera User[]. Uma chave que falta em alguns itens vira opcional (key?:).
  • Valores null se combinam com os outros valores vistos para aquela chave: string | null. Uma chave que é sempre null vira unknown ou any.
  • Arrays mistos viram arrays de união, como (number | string)[].
  • Formatos idênticos são declarados uma vez e reutilizados, e formatos diferentes que teriam o mesmo nome recebem um sufixo numérico.
  • Chaves que não são identificadores válidos, como "first-name" ou "2fa", ficam entre aspas.

interface vs. type

Para formatos de objeto simples, os dois são quase intercambiáveis. Declarações interface podem ser estendidas e mescladas, e geram erros de compilação um pouco mais claros. Aliases type também podem expressar uniões e mapped types. Muitas equipes usam interfaces para modelos de API e types para todo o resto; escolha o que o seu código ou linter (@typescript-eslint/consistent-type-definitions) espera.

Tipos melhores a partir do seu exemplo

Os tipos só podem ser tão completos quanto o exemplo. Cole uma resposta que inclua campos opcionais, ou um array com vários itens variados, para que o gerador detecte chaves opcionais e nullable. Valores como datas e enums chegam como strings simples no JSON; refine-os manualmente depois, por exemplo status: 'active' | 'disabled'. Para validação em tempo de execução, combine os tipos gerados com uma biblioteca de schemas como o Zod.

Perguntas frequentes

Meu JSON é enviado para algum lugar?
Não. Os tipos são gerados por JavaScript no seu navegador. Respostas de API com tokens ou dados pessoais nunca saem do seu dispositivo.
Como as propriedades opcionais são detectadas?
Quando objetos do mesmo array têm chaves diferentes, as chaves ausentes em pelo menos um objeto são marcadas como opcionais com ?. Com um único objeto, todas as chaves são obrigatórias, a menos que você marque Todos opcionais.
Devo usar <code>unknown</code> ou <code>any</code>?
unknown é mais seguro: o TypeScript obriga você a refinar o valor antes de usá-lo. any desliga a checagem de tipos para aquele valor. Use-o apenas se pretende refinar os tipos depois.
Por que uma data ISO é tipada como <code>string</code>?
O JSON não tem tipo de data, então as datas trafegam como strings. Se você as converte com new Date() depois do parse, mude a propriedade para Date no seu modelo.
Ele lida com JSON grande ou muito aninhado?
Sim. A geração é linear no tamanho da entrada e roda localmente, então respostas de vários megabytes são convertidas em bem menos de um segundo.

Ferramentas relacionadas

Formatador JSON Formate, minifique e valide JSON com erros por linha/coluna. JSON Diff Compare dois objetos JSON e liste as mudanças por caminho. YAML para JSON Converta configs YAML para JSON, com suporte a múltiplos documentos e erros precisos. Conversor de cURL Transforme comandos curl em código fetch, Axios, Python, Go ou PHP.