JSON
Programação de Script
O que é




JSON: JavaScript Object Notation.
JSON e um padrão de troca e armazenamento de
dados.
JSON é similar ao XML porem mais compacto, mais
rapido e mais simples de utilizar.
E independente de plataforma e linguagem de
programação.
Exemplo

{
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}
Por que JSON ?


Para utilização de aplicações AJAX, JSON e mais
rapido e mais facil que com XML.
E um formato de intercambio de dados entre
tecnologias distintas.
Exemplo com Javascript


<!DOCTYPE html>
<html>
<body>
<h2>JSON Object Creation in JavaScript</h2><p>
Name: <span id="jname"></span><br />
Age: <span id="jage"></span><br />
Address: <span id="jstreet"></span><br />
Phone: <span id="jphone"></span><br />
</p>
<script>
var JSONObject= {
"name":"John Johnson",
"street":"Oslo West 555",
"age":33,
"phone":"555 1234567"};
document.getElementById("jname").innerHTML=JSONObject.name;
document.getElementById("jage").innerHTML=JSONObject.age;
document.getElementById("jstreet").innerHTML=JSONObject.street;
document.getElementById("jphone").innerHTML=JSONObject.phone;
</script>
</body>
</html>
Sintaxe




Dado e composto pelo conjunto nome/valor.
Dado e separado por virgula.
Chaves definem o objeto
Colchetes definem uma coleção
Exemplo: "firstName" : "John"
Tipo de dados






number (inteiro ou real)
string (entre aspas duplas)
boolean (true or false)
array (entre colchetes)
object (entre chaves)
null
Objetos



Objetos do JSON são escritos entre chaves
Objetos podem contem multiplos conjuntos de
nomes/valores.
Exemplo
{
"firstName":"John" ,
"lastName":"Doe" }
Coleção


Uma coleção contem vários objetos e delimitado
por chaves.
{
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}
Coleção


Exemplo de acesso a um atributo de um objeto da
coleção:
Lendo o primeiro objeto:
 employees[0].firstName
+ " " +
employees[0].lastName;

Alterando o atributo de um objeto:
 employees[0].firstName
= "Gilbert";
Como Fazer

Convertendo um JSON em formato texto em um
objeto no javascript:
var txt = '{ "employees" : [' +
'{ "firstName":"John" ,
"lastName":"Doe" },' +
'{ "firstName":"Anna" ,
"lastName":"Smith" },' +
'{ "firstName":"Peter" ,
"lastName":"Jones" } ]}';
var obj = eval("(" + txt + ")");
obj.employees[1].firstName;
JSON e JQUERY


Utilizaremos a função jQuery.getJSON, essa função
será responsável por obter os dados contidos no
nosso json.
jQuery.getJSON( url, [data], [callback] )
 url
-> A url requisitada (parâmetro obrigatório)
 [data] -> dados que serão enviados via GET
(parâmetro opcional)
 [callback] -> Função que será executada quando os
dados forem carregados com sucesso (parâmetro
opcional)
JSON e JQUERY

Exemplo
 Fonte
de dados:
 {"codigo":"2","nome":“Prof. Norton
","perfil":“Professor","horario":"Noite"}
JSON e JQUERY
$.getJSON( "data.js",
function(data){
$('#nome').text(data.nome);
$('#perfil').text(data.perfil);
$('#horario').text(data.horario);
} );
);
Jquery – Método POST e JSON


Na estrutura da função POST existe um parâmetro
opcional que permite definir o tipo de retorno da
função de callback
$(selector).post(URL,data,function
(data,status,xhr),dataType)
Parâmetro Data Type






"xml" – um documento XML
"html" – texto em formato HTML
"text" – uma string
"script" - Runs the response as JavaScript, and returns it
as plain text
"json" - Runs the response as JSON, and returns a
JavaScript object
"jsonp" - Loads in a JSON block using JSONP. Will add
an "?callback=?" to the URL to specify the callback
Fonte


http://www.w3schools.com/json/
http://www.zigolis.com.br/blog/manipulacao-jsoncom-jquery/
Download

JSON