![[tutorial] json em javascript Tumblryy](https://2img.net/r/ihimg/scaled/large/854/tumblryy.png)
Início
![[tutorial] json em javascript QdhdIA2](https://i.imgur.com/qdhdIA2.png)
e ae galera faz um tempinho sem escrever tutorial, nesse tutorial vou ensinar como usar json em javascript, o json é muito usado para arquivos de configuração ou para criar estruturas em forma de hierarquia que vao ser usado em uma pagina tipo o xml tanto que é possivel converte o xml em json e vice versa, a vantagem do json é que nao fica dados tao disperso igual o xml, para usar json no javascript usamos a classe JSON para converte uma string em um objeto e assim usar os atributos do objeto para manipular os valores equivalente na estrutura json, a estrutura json separa cada segmento com chaves entao cada par de chaves dentro da outra é uma sub chave da anterior, e existe um par de chaves que é a raiz onde as demais sao sub chaves ou atributo dela (igual o xml que existe a tag principal root)
os atributos deve conter um nome e um valor (o valor pode ser um conjunto de valores ou uma sub chave da mesma vamos ver isso mais para frente), no caso o nome e o valor é separado por dois pontos (o nome deve estar entre aspas o valor tambem caso seja um texto e nao numero)
embora eu to escrevendo um na frente do outro podemos pular linha ou usar espaço
em javascript o codigo anterior seria interpretado e acessado dessa forma (mais para frente vamos ver como usar o json em javascript primeiro temos que entender como funciona a estrutura json)
podemos usar um conjunto de valores para isso colocamos ele entre colchetes seprado por virgula
em javascript para acessar os valores seria o mesmo que uma array
podemos criar uma sub-chave para segmentar novos nomes e valores dentro daquela chave
em javascript para acessar basta acessar a chave seguido da sub-chave
podemos criar quantas subchaves a gente quiser
e para acessar mesma coisa so ir acessando todas as chaves ate o atributo
tambem podemos cria uma chave dentro de um conjuto de valores
para acessar ficaria assim
bom galera o json é basicamente isso agora como acessar ele via javascript, para começar criamos uma pagina basica
agora criamos uma variavel e atribuimos a ela uma string que seria o nosso json
agora usamos o objeto JSON e o metodo parse passamos como argumento a nossa string com o json nela, e atribuimos ele para uma nova variavel para manipular ele
pronto agora so usar os atributos dentro da variavel
caso voce precise acessar um arquivo json externamente que nao ta pagina voce pode usar XMLHttpRequest ou iframe ^^
by kõdo no kami
- Código:
{}
os atributos deve conter um nome e um valor (o valor pode ser um conjunto de valores ou uma sub chave da mesma vamos ver isso mais para frente), no caso o nome e o valor é separado por dois pontos (o nome deve estar entre aspas o valor tambem caso seja um texto e nao numero)
- Código:
{ "nome" : "kodo no kami" , "idade" : 22 }
embora eu to escrevendo um na frente do outro podemos pular linha ou usar espaço
- Código:
{
"nome" : "kodo no kami",
"idade" : 22
}
em javascript o codigo anterior seria interpretado e acessado dessa forma (mais para frente vamos ver como usar o json em javascript primeiro temos que entender como funciona a estrutura json)
- Código:
objeto.nome;
objeto.idade;
podemos usar um conjunto de valores para isso colocamos ele entre colchetes seprado por virgula
- Código:
{
"nomes" : ["kodonokami","hfts315","flavio"]
}
em javascript para acessar os valores seria o mesmo que uma array
- Código:
objeto.nomes[0];
objeto.nomes[1];
objeto.nomes[2];
podemos criar uma sub-chave para segmentar novos nomes e valores dentro daquela chave
- Código:
{
"kodo" : {
"nomereal" : "flavio",
"antigonick" : "hfts315"
}
}
em javascript para acessar basta acessar a chave seguido da sub-chave
- Código:
objeto.kodo.nomereal;
objeto.kodo.antigonick;
podemos criar quantas subchaves a gente quiser
- Código:
{
"pais" : {
"brasil" : {
"estado" : {
"rio" : 21,
"minas" : 31
}
}
}
}
e para acessar mesma coisa so ir acessando todas as chaves ate o atributo
- Código:
objeto.pais.brasil.estado.rio;
objeto.pais.brasil.estado.minas;
tambem podemos cria uma chave dentro de um conjuto de valores
- Código:
{
"id" : [{
"nick" : "kodo no kami",
"permi" : 1,
}]
}
para acessar ficaria assim
- Código:
objeto.id[0].nick;
objeto.id[0].permi;
bom galera o json é basicamente isso agora como acessar ele via javascript, para começar criamos uma pagina basica
- Código:
<html>
<body>
<script type="text/javascript">
</script>
</body>
</html>
agora criamos uma variavel e atribuimos a ela uma string que seria o nosso json
- Código:
<html>
<body>
<script type="text/javascript">
var kodo = '{ "member" : [{ "nome": "kodo no kami" }] }';
</script>
</body>
</html>
agora usamos o objeto JSON e o metodo parse passamos como argumento a nossa string com o json nela, e atribuimos ele para uma nova variavel para manipular ele
- Código:
<html>
<body>
<script type="text/javascript">
var kodo = '{ "member" : [{ "nome": "kodo no kami" }] }';
var kami = JSON.parse(kodo);
</script>
</body>
</html>
pronto agora so usar os atributos dentro da variavel
- Código:
<html>
<body>
<script type="text/javascript">
var kodo = '{ "member" : [{ "nome": "kodo no kami" }] }';
var kami = JSON.parse(kodo);
document.write(kami.member[0].nome);
</script>
</body>
</html>
caso voce precise acessar um arquivo json externamente que nao ta pagina voce pode usar XMLHttpRequest ou iframe ^^
by kõdo no kami
