O que é JSON, como e quando utilizar?

JSON (JavaScript Object Notation) é uma estrutura de dados em javascript.
Apesar de começarem a falar muito disso recentemente, JSON não é uma tecnologia nova, faz parte do javascript puro e não precisa de nenhum script pra trabalhar.

O JSON pode substituír o XML, e faz isso muito bem na hora de trabalhar com respostas em AJAX.
A estrutura de dados fica mais simples de trabalhar e o tempo de execução de um script lendo dados em JSON é dezenas de vezes mais rápido do que ler um conteúdo XML.

As principais linguagens de programação server side tem suporte pra escrever dados em JSON.

Veja o exemplo da estrutura de dados abaixo

var dados = {
	"aluno" : [
		{"nome":"João", "provas":  [ { "nota":8 }, {"nota":6}, {"nota":10 }, {"nota":2 } ] },
		{"nome":"Maria", "provas": [ { "nota":3}, {"nota":5}, {"nota":8 }, {"nota":1 } ] },
		{"nome":"Pedro", "provas": [ { "nota":7}, {"nota":6}, {"nota":6 }, {"nota":8 } ] },
	]
};

Veja como seria a mesma estrutura de dados em XML:

<?xml version='1.0' encoding='utf-8'?>
<aluno>
	<nome>Danilo</nome>
	<provas>
		<prova nota=8/>
		<prova nota=6/>
		<prova nota=10/>
		<prova nota=2/>
	</provas>
</aluno>
<aluno>
	<nome>Belinha</nome>
	<provas>
		<prova nota=3/>
		<prova nota=5/>
		<prova nota=8/>
		<prova nota=1/>
	</provas>
</aluno>
<aluno>
	<nome>Carla</nome>
	<provas>
		<prova nota=7/>
		<prova nota=6/>
		<prova nota=6/>
		<prova nota=8/>
	</provas>
</aluno>

Apesar do xml ter mais chaves e colchetes, fica mais facil de ler os dados:

var jsonData = eval(dados);

E pronto, bem mais simples que xml!

Depois para obter os dados funciona assim:

document.write(jsonData.aluno[0].nome);
// Escreve o nome do primeiro aluno: "Danilo";

document.write(jsonData.aluno[1].provas.nota[3]);
// Escreve a nota da última prova da Belinha ;

document.write(jsonData.aluno[2].provas.nota[0]);
// Escreve a nota da primeira prova da Carla ;

for(i=0;i<jsonData.aluno.length;i++){
	document.write(jsonData.aluno[i].nome);
}
// escreve o nome de todos os alunos

for(i=0;i<jsonData.aluno.length;i++){
	document.write(jsonData.aluno[i].nome);
	for(j=0;j<jsonData.aluno[i].provas.length;j++){
		document.write(jsonData.aluno[i].provas[j].nota);
	}
}
// escreve o nome e todas as notas de todos os alunos

No site JSON.org pode encontrar mais informações, em português.

bookmark bookmark bookmark bookmark bookmark bookmark bookmark

Você pode se interessar também por:

5 Responses to “O que é JSON, como e quando utilizar?”

  1. 1
    O Bug do parse XML no IE com o ajax do jQuery | TidBits Says:

    [...] Solução número 1 – Pare de trabalhar com XML e comece a usar JSON. [...]

  2. 2
    snyper128 Says:

    Já tinha visto algo sobre JSON mas não imaginei que erra tão simples assim.

  3. 3
    Thiago Couto Says:

    Gosto de trabalhar com JSON por causa da velocidade se comparado ao parse do XML.

    Boa explicação, simples e direta.

  4. 4
    Luis Felipe Corrêa Pérez Says:

    Bom dia.

    Muito bom e útil o artigo. Quero informar que a linha “Apesar do xml ter mais chaves e colchetes, fica mais facil de ler os dados:” está errada. São os JSON que possuem mais chaves e colchetes.

    Parabens! Até breve.

  5. 5
    Márcio Says:

    Faltou data de quando foi postado!

Leave a Reply