JSON, o que é?

Publicado em 29/05/2016 - Javascript

Sem sombra de dúvidas JSON tem sido um formato de dados amplamente utilizado por desenvolvedores em todo o mundo.
Mas afinal, o que é JSON?

JSON significa Javascript Object Notation, e é uma forma de representação de dados. Extramamente leve, de fácil leitura e escrita para humanos assim como fácil interpretação e geração para máquinas. É um formato de texto, totalmente independente de linguagem (a referência a Javascript no nome se dá apenas pela forma com que objetos são representado em JS e no próprio JSON).

A principal função do JSON é permitir a troca de dados entre sistemas. Por exemplo, a comunicação entre um webservice implementado em PHP e uma aplicação Mobile poderá ser realizada utilizando-se JSON.
Outro exemplo interessante seria o storage de dados em uma aplicação (como, por exemplo, o save state em um jogo).

Mas afinal, como se parece e como utilizar um JSON?

Abaixo, um exemplo de informações em formato JSON:

{
	"area" : 40,
	"comodos" : {
		"salas" : 1,
		"quartos" : 2,
		"cozinhas" : 1,
		"banheiros" : 1,
		"garagens" : 1
	},
	"endereco" : {
		"logradouro" : "Nome da Rua",
		"numero" : 1000,
		"complemento" : "ap 101",
		"bairro" : "Nome do Bairro",
		"cep" : "12345-000",
		"cidade" : "Nome da Cidade"
	},
	"extras" : ["elevador","portaria"]
}

Prazer, este é o formato JSON.

O formato segue a segunte estrutura:

  • 1. Inicia sempre com o caractere "{"
  • 2. Uma "string", que será a chave do item
  • 3. O caractere ":" separa a chave do valor
  • 4. Um valor, que será o conteúdo do item
  • 5. Se houver mais itens, colocar um caractere "," como separador e retornar ao item 2
  • 6. Finaliza sempre com o caractere "}"

Um valor deve ser de acordo com algum dos seguintes items:
  • String
  • Number
  • Object(1)
  • Array(2)
  • true
  • false
  • null

Observações:
  • 1. Um JSON pode conter outros JSONs como valores de seus itens.
  • 2. Um array é, essencialmente, um caractere "[", uma lista de itens (strings, numbers, objects, arrays, true, false, null), separador pelo caractere "," e finalizados pelo caractere "]". Por exemplo:

["Nome", "Sobrenome", 18, {"dia":31, "mes":12, "ano":1969}, true, [1,2,3]]

Quando desenvolver códigos que gerem JSONs, verifique se o seu resultado é de fato um JSON válido: http://jsonlint.com/

A maioria das linguagens de programação populares possuem algum mecanismo para geração de JSON. Consulte a documentação de sua linguagem preferida.

Neste artigo, utilizarei PHP e o próprio Javascript como exemplos.

Em PHP poderíamos gerar e interpretar JSONs da seguinte maneira:

<?php
	
	$minhaCasa = new stdClass();
	$minhaCasa->area = 40;

	$minhaCasa->comodos = new stdClass();
	$minhaCasa->comodos->salas = 1;
	$minhaCasa->comodos->quartos = 2;
	$minhaCasa->comodos->cozinhas = 1;
	$minhaCasa->comodos->banheiros = 1;
	$minhaCasa->comodos->garagens = 1;

	$minhaCasa->endereco = new stdClass();
	$minhaCasa->endereco->logradouro = "Nome da Rua";
	$minhaCasa->endereco->numero = 1000;
	$minhaCasa->endereco->complemento = "ap 101";
	$minhaCasa->endereco->bairro = "Nome do Bairro";
	$minhaCasa->endereco->cep = "12345-000";
	$minhaCasa->endereco->cidade = "Nome da Cidade";

	$minhaCasa->extras = array("elevador","portaria");

	$json = json_encode($minhaCasa);

	// Aqui, você tera algo como o JSON que apresentei no primeiro exemplo deste artigo.
	echo $json;

	// Agora, o objeto outraCasa fez a interpretação do json gerado.
	// Ou seja, deve ser um objeto igual ao $minhaCasa.
	$copiaCasa = json_decode($json); 

?>

Note o uso das funções json_encode( ) e json_decode( ). A primeira recebe um objeto qualquer (ou array associativo) e retorna uma string no formato JSON. A sergunda função, faz o contrário, recebendo uma string em formato JSON e retornando um objeto com os dados informados.
Futuramente, farei um artigo sobre AngularJS e utilizaremos estes conceitos para comunicar nossa aplicação com o servidor.

Agora, um outro exemplo em Javascript. Fique atento: javascript e JSON utilizam a mesma sintaxe, então, pode parecer que são a mesma coisa.

var meuObjeto = {
	"nome" : "Nome do Funcionário",
	"salario" : 2000,
	"aniversario" : new Date(1980,10,25)
};

var jsonString = JSON.stringify(meuObjeto);

// Perceba que o javascript converteu o nosso objeto (var meuObjeto) em string.
console.log(jsonString + "(tipo: " + (typeof jsonString) + ")");

// Se fizermos a operação inversa:
var jsonObject = JSON.parse(jsonString);
console.log(jsonObject + "(tipo: " + (typeof jsonObject) + ")");

Com isto, acreito que finalizamos os conceitos básico do JSON.
Use, entenda e pergunte
Em breve, teremos mais artigos que farão uso desdes conceitos, então, é importante que estejam bem embasados.

Até mais e bons códigos ;)