O JSON é um formato leve de integração de dados utilizado principalmente para armazenar e transportar dados de um servidor ou sistema para outro. Por outro lado, um Mapa também armazena dados e utiliza o formato de valor-chave onde a chave pode ter qualquer tipo de dados. O desenvolvedor pode recuperar dados específicos selecionando sua chave correspondente.
Este artigo explica o processo de conversão de JSON de/para um mapa em JavaScript, abordando as seguintes seções:
- Como converter dados JSON em um mapa em JavaScript?
- Como converter dados JSON de um mapa em JavaScript?
- Como buscar API JSON e converter seus dados em mapa
Como converter dados JSON em um mapa em JavaScript?
A conversão de dados JSON em um mapa preserva o formato do par chave-valor como 'Mapa' e também armazena dados no formato de valor-chave, assim como JSON. Assim, o desenvolvedor pode manter a ordem original das chaves que não é garantida com a conversão de objetos JavaScript. Convertendo “JSON” dados em 'Mapa' oferece mais flexibilidade e permite que o desenvolvedor use métodos integrados do Map para fornecer facilidade ao percorrer os dados.
Vamos visitar o bloco de código abaixo, onde os dados JSON codificados serão convertidos em um mapa:
< tipo de script = 'texto/javascript' >
const jsonFormat = '{'author1':'Jackson','author2':'Reed','author3':'Tasha','author4':'Petterson'} ' ;
const mapFormat = novo Mapa ( Objeto . entradas ( JSON. analisar ( jsonFormat ) ) ) ;
console. registro ( mapFormat ) ;
roteiro >
A explicação do código acima é declarada como:
- Primeiro, crie uma variável do tipo const chamada 'jsonFormat' contendo dados no formato JSON, ou seja, no formato de valor-chave.
- A seguir, crie uma nova instância do Mapa com o nome “formatomapa” . Para analisar os dados JSON, passe o “formatomapa” dentro de “JSON.parse()” método.
- Em seguida, passe o resultado retornado por este método para o “Objeto.entradas()” para criar uma matriz de matrizes e cada matriz interna representa os pares de valores-chave.
- Passe o resultado final ou todos esses métodos ao longo do alinhamento adequado dentro do 'Mapa' construtor. Agora, sua instância “formatomapa” contém os dados JSON convertidos que são exibidos na janela do console usando o “console.log ()” método.
Após a compilação do código acima, a janela do console ficará assim:
A saída confirma que os dados JSON foram convertidos em Mapa. Para obter mais informações e exemplos para converter dados JSON em um array ou mapa, você pode visitar nosso outro artigo .
Como converter dados JSON de um mapa em JavaScript?
A conversão de dados no formato JSON aumenta sua disponibilidade vitalícia e permite enviar esses dados para qualquer lugar da rede sem perdê-los. Além disso, o formato JSON é facilmente legível e pode ser usado em APIs web ou arquivos de configuração. No programa abaixo, os dados do mapa serão convertidos para o formato JSON:
< tipo de script = 'texto/javascript' >const mapFormat = novo Mapa ( [
[ 'autor1' , 'Jackson' ] ,
[ 'autor2' , 'Junco' ] ,
[ 'autor3' , 'Tasha' ] ,
[ 'autor4' , 'Peterson' ] ,
] ) ;
const jsonFormat = JSON. restringir ( Objeto . deEntradas ( mapFormat ) ) ;
console. registro ( jsonFormat ) ;
roteiro >
A explicação do bloco de código acima é declarada como:
- Primeiro, a instância chamada “formatomapa” é criado para o Mapa que contém diversas entradas.
- A seguir, o “Object.fromEntries()” método é utilizado e o “formatomapa” é passado para ele. Isso converterá os dados do mapa fornecidos em uma matriz aninhada.
- Em seguida, o array aninhado é passado para o “JSON.stringify()” método para converter a matriz aninhada no formato JSON, preservando o alinhamento do par chave-valor.
- No final, os dados gerados no formato JSON são exibidos na janela do console.
A saída gerada após a compilação do código acima é mostrada abaixo:
A saída mostra que os dados do mapa agora foram convertidos para o formato JSON com sucesso.
Como buscar a API JSON e converter seus dados em mapa?
Os dados JSON recebidos da API também podem ser convertidos diretamente em Map utilizando a mesma abordagem descrita acima na primeira seção. Para fazer isso, a API precisa primeiro ser buscada e depois os dados JSON buscados são convertidos no Mapa, conforme mostrado abaixo:
< roteiro >assíncrono função converterJSONApi ( ) {
tentar {
const resolução = aguardar buscar ( 'https://jsonplaceholder.typicode.com/todos/' ) ;
const jsonFormat = aguardo res. JSON ( ) ;
const mapFormat = novo Mapa ( Objeto . entradas ( jsonFormat ) ) ;
console. registro ( mapFormat ) ;
} pegar ( causaErro ) {
console. erro ( 'Erro ao buscar ou converter dados:' , causaErro ) ;
}
}
converterJSONApi ( ) ;
roteiro >
A descrição do código acima é apresentada abaixo:
- Primeiro, a função assíncrona chamada “converterJSONApi()” é definido utilizando a palavra-chave “async” atrás da função “palavra-chave” .
- A seguir, use o 'tentar' bloquear e criar um “constante” variável de tipo “res” que armazenará os dados obtidos da API. A busca é feita inserindo o link da API dentro do 'buscar()' método. Além disso, anexe o 'aguardam' palavra-chave por trás disso 'buscar()' método para aguardar a chegada de todos os dados da API.
- Em seguida, aplique o “json()” método na variável “res” para ler todos os dados recebidos ou buscados. O 'aguardam' a palavra-chave também é aplicada atrás dela para aguardar a conclusão da leitura dos dados. Passe o resultado na variável chamada 'jsonFormat' .
- Depois disso, o 'jsonFormat' é passado dentro do método chamado “Objeto.entradas()” para criar uma matriz aninhada para os dados fornecidos. Isso é então passado dentro do 'Mapa()' construtor para converter os arrays em Map e é armazenado no 'Mapa' instância nomeada “formatomapa” .
- Esta API JSON buscada, que agora é convertida em Mapa, é então exibida no console exibindo o “formatomapa” variável dentro do “console.log ()” método.
- Para detectar qualquer erro causado durante todo o processo, utilize o 'pegar' bloco e passa nele um parâmetro fictício que contém erros ocorridos e para tratá-lo exibe uma mensagem fictícia.
A saída após a conclusão do código acima é mostrada abaixo:
A saída mostra que os dados no formato JSON foram recuperados da API fornecida e, em seguida, esses dados são convertidos no Mapa.
Você aprendeu sobre o processo de conversão de JSON em Map e Map em JSON em JavaScript.
Conclusão
Para converter dados JSON em Map, métodos como “JSON.parse()” e “Objeto.entradas()” são usados. O primeiro analisa os dados JSON e o segundo cria uma matriz aninhada de dados analisados. No caso de conversão de dados do mapa para o formato JSON, o “Object.fromEntries()” e “JSON.stringify()” são usados métodos que converterão os dados em uma matriz aninhada e os converterão no formato JSON, respectivamente. Este blog explicou o procedimento para converter JSON de e para um mapa em JavaScript.