O que é um editor de árvore JSON?

O JSON armazena dados como objetos, que contêm valores nomeados, e arrays, que contêm listas ordenadas. Como eles podem ser aninhados, um documento grande é difícil de alterar em um editor de texto simples: uma vírgula ou chave ausente torna o arquivo inteiro inválido. Um editor de árvore mostra os mesmos dados como um conjunto de nós que você pode abrir e fechar. Você altera um valor, renomeia uma chave ou adiciona e remove um nó diretamente, e a ferramenta cuida das vírgulas, aspas e colchetes.

Descrição da ferramenta

Esta ferramenta permite editar JSON como uma árvore. Cole seu JSON e ele aparecerá como uma árvore de objetos, arrays e valores. Use o lápis ao lado de um nó para alterar sua chave ou valor, o sinal de mais ao lado de um objeto ou array para adicionar um filho e a lixeira para remover um nó. Cada alteração é imediatamente escrita de volta no texto JSON, para que você possa copiar o resultado quando terminar. Você ainda pode digitar no editor de texto, e a árvore acompanhará as alterações. Tudo acontece no seu navegador, e seus dados não são enviados para lugar algum.

Exemplos

Comece com este JSON:

{
  "nome": "aplicativo-exemplo",
  "porta": 8080,
  "etiquetas": ["json", "árvore"]
}
JSON

Altere porta para 3000, adicione a string editor a etiquetas e adicione uma nova chave privado definida como true. O texto ficará assim:

{
  "nome": "aplicativo-exemplo",
  "porta": 3000,
  "etiquetas": ["json", "árvore", "editor"],
  "privado": true
}
JSON

Recursos

  • Edite chaves, strings, números, valores booleanos e valores nulos no próprio local
  • Adicione novas chaves a objetos e novos itens a arrays e remova qualquer nó, exceto a raiz
  • Altere o tipo de um valor, por exemplo, de uma string para um número
  • Mantém a ordem das chaves e avisa quando uma chave já é usada no mesmo objeto
  • Expanda ou recolha a árvore inteira e veja quantos nós ela contém

Como funciona

A ferramenta analisa seu texto como JSON e mostra o resultado como uma árvore. Quando você faz uma alteração, ela cria uma nova cópia dos dados com essa alteração e a converte novamente em texto com indentação de 2 espaços. Renomear uma chave mantém sua posição entre os nós irmãos. Chaves que parecem números inteiros, como "1" ou "2", são sempre listadas primeiro em ordem crescente, como em todo analisador JSON de JavaScript.

Um valor tem um de seis tipos: string, número, booleano, nulo, objeto ou array. Objetos e arrays novos começam vazios, e você os preenche com o botão de mais. Um objeto ou array que já tenha filhos mantém seu tipo, para que você não perca seu conteúdo por acidente, mas ainda pode renomear sua chave.

Dicas

  • Pressione Enter para salvar uma alteração e Escape para cancelá-la. Em uma string, pressione Shift e Enter para adicionar uma quebra de linha
  • Se o texto à esquerda não for um JSON válido, a árvore permanecerá vazia e o erro será exibido até que você corrija o problema
  • A árvore não tem função de desfazer, portanto mantenha uma cópia do seu JSON original se não tiver certeza sobre uma alteração
  • Números maiores que 9007199254740991 perdem precisão, porque os números JSON são lidos como números de JavaScript
  • Para apenas visualizar JSON sem alterá-lo, use o Visualizador de árvore JSON