DEV Community

Cover image for JSON: Que bruxaria é essa?!?!
ananopaisdojavascript
ananopaisdojavascript

Posted on

JSON: Que bruxaria é essa?!?!

Começando pela definição...

JSON (JavaScript Object Notation - Notação de Objeto JavaScript) é um modo de representar dados estruturados na linguagem JS. É composto por uma chave (propriedade) e um valor.

{
    "nomeDoPokemon": "Pikachu",
    "tipoDePokemon": "Elétrico"
}
Enter fullscreen mode Exit fullscreen mode

Tipos básicos

Os tipos básicos presentes no JSON são:

  • Strings (Cadeia de texto ou caracteres)
  • Number (Números inteiros ou reais)
  • Booleano (Verdadeiro ou falso)
  • Nulo (null)
{
  "nomeDoPokemon": "Pikachu",
  "tipoDePokemon": "Elétrico",
  "numeroDoPokemon": 5,
  "isThisPokemonNormal": false,
  "nullPokemon": null
}
Enter fullscreen mode Exit fullscreen mode

Como eu converto um texto em JSON?

É só usar a função JSON.parse() e colocar como parâmetro o texto que será convertido.

const texto = '{"atributo1": "valor 1", "atributo2": 23}';

const objeto = JSON.parse(texto);

console.log(objeto);
Enter fullscreen mode Exit fullscreen mode

Como eu converto um objeto JSON em texto?

É só usar a função JSON.stringify() e colocar como parâmetro o objeto que será convertido.

const objeto = {
    "atributo1": "valor 1",
    "atributo2": 23
};

const texto = JSON.stringify(objeto);

console.log(texto);
Enter fullscreen mode Exit fullscreen mode

Como ler os dados dos atributos de um objeto JSON?

Podemos ler os dados dos atributos de um objeto JSON por ponto ou por colchetes

Notação de ponto

const texto = {
    "atributo1": "valor 1",
    "atributo2": 23
};

console.log(texto.atributo1);
Enter fullscreen mode Exit fullscreen mode

Notação de colchetes

const texto = {
    "atributo1": "valor 1",
    "atributo2": 23
};

console.log(texto["atributo1"]);
Enter fullscreen mode Exit fullscreen mode

Adicionar uma nova propriedade

Podemos também incluir uma nova propriedade ao objeto JSON

const texto = {
    "atributo1": "valor 1",
    "atributo2": 23
};

texto.atributo3 = null;

console.log(texto);
Enter fullscreen mode Exit fullscreen mode

Excluir uma propriedade

Podemos também excluir uma propriedade com o operador delete.

delete texto.atributo3;
Enter fullscreen mode Exit fullscreen mode

E aí? Gostaram? Até a próxima anotação! 😊

Discussion (0)