JavaScript - JSON - Parse

O que faz ?

JSON.Parse converte um string em um objeto JSON.

Ao fazer um request e receber um resultado ele é recebido como um string de dados. Para converter ele em um objeto JSON usamos a função Parse.

Agregando uma outra explicação, A função parse desmembra um string num objeto JSON, ou seja, converte um string em JSON.

Exemplo

Neste exemplo temos 2 variáveis com 2 valores, um para cada variável.
Vamos exibir os valores dessas variáveis usando Json.Parse.

Código

const json = '{"resultado":true, "cnt":42}';
const obj = JSON.parse(json);
document.getElementById("ValorResultado").value = obj.resultado; // valor esperado: true
document.getElementById("ValorCnt").value = obj.cnt; //valor esperado : 42

Explicação

Primeiramente definimos o string de dados a ser convertido num objeto JSON:
const json = '{"resultado":true, "cnt":42}';

Importante que temos 2 dados com os nomes resultado e cnt. Também temos 2 valores desses dados, true e 42.

Note que os 2 dados estão separados por vírgula.

Segundo convertemos o string num objeto JSON.
const obj = JSON.parse(json);

Terceiro colocamos os valores dos objetos que desejamos exibir nos boxes de valores.
document.getElementById("ValorResultado").value = obj.resultado; // valor esperado: true
document.getElementById("ValorCnt").value = obj.cnt; //valor esperado : 42

Importante: Note que estamos exibindo os valores pelos nomes dos objetos.
Portanto este método só funciona quando sabemos exatamente a resposta recebida e que esses dados são obrigatórios, ou seja, sempre virão.

Note que obj.resultado e obj.cnt; são os valores
document.getElementById("ValorResultado").value e document.getElementById("ValorCnt").value são 2 inputboxes que exibem os valores.

Valores extraídos do JSON

Variável 1 - Nome: resultado-Valor:

Variável 1 - Nome: cnt-Valor:

Importante

Podemos definir um string json: const jsonString = '{ nome: "João", idade: 30, cidade: "Catanduva" }';

Podemos definir um objeto json: const jsonOject = { nome: "João", idade: 30, cidade: "Catanduva" };

A diferença de um para outro é que um é um string definido por um par de aspas simples ou duplas e o outro é objeto JSON em sí.

Cuidado

JSON.parse tem que ser escrito dessa maneira, JSON em maiúsculo e parse em minúsculo. Similar ao filho da mãe document.getElementById, uma letrinha errada e tá tudo errado. Chamamos isso de case sensitive, ou seja, diferencia maiúsculas e minúsculas.