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/