Converter JSON para TypeScript

Para converter JSON para TypeScript, cole dados de exemplo abaixo: a ferramenta gera interfaces ou tipos com objetos aninhados, arrays e campos opcionais – ou um esquema JSON. Seus dados ficam no navegador.

Fonte: TypeScript Handbook – Object Types (interfaces, optional properties, readonly). Atualizado em: .

Resultado

Resultado
export interface Root { id: number; name: string; email: null; tags: string[]; address: Address; orders: Order[]; active: boolean; } export interface Address { street: string; zip: string; } export interface Order { no: number; total: number; voucher?: string; }
Resumo
3 tipos gerados a partir de 217 caracteres de JSON.
Só é deduzido o que aparece nos dados de exemplo: um campo que nunca foi null ali não é reconhecido como anulável; campos que não estão em todos os objetos viram opcionais (?).

Como o cálculo é feito

Converter JSON para TypeScript significa deduzir os tipos certos a partir de dados de exemplo. {"id": 1, "name": "Anna"} vira uma interface com id: number e name: string. A ferramenta lê seu JSON no seu navegador, junta objetos do mesmo tipo e escreve os tipos como código-fonte – sem upload.

Como funciona

  1. Cole o JSON no campo, por exemplo uma resposta de API.
  2. Escolha a saída: interfaces, tipos (type) ou esquema JSON. Ajuste nomes, export, readonly e indentação como quiser.
  3. Copie o resultado e cole no seu projeto.

Como os tipos são formados

Limites

O resultado é um rascunho: confira com a documentação da interface, pois dados de exemplo não mostram todos os casos possíveis.

Privacidade

O JSON não sai do seu navegador. Para continuar: formatar JSON, CSV para JSON ou YAML para JSON.

Perguntas frequentes

Como converter JSON para TypeScript?

Cole o JSON e escolha “Interfaces TypeScript”: a ferramenta gera interfaces com todos os campos, tipos aninhados e arrays. Copie para o seu projeto.

Interface ou type: qual é melhor?

Ambos descrevem a mesma forma. Interfaces podem ser estendidas e costumam dar mensagens de erro melhores; type é mais flexível com uniões. A ferramenta gera um ou outro.

Como a ferramenta detecta campos opcionais?

Um campo que falta num objeto mas aparece em outro ganha um ponto de interrogação. Para isso, vários objetos de um array são juntados.

Também dá para gerar um esquema JSON?

Dá, escolha “Esquema JSON (2020-12)”. O esquema traz tipos, propriedades aninhadas e a lista de campos obrigatórios.

Meu JSON é enviado a algum lugar?

Não. Os tipos são criados inteiramente no seu navegador.

Fontes e base legal

Última atualização: · Princípios editoriais

Ferramentas relacionadas