Json

Algo que mostré en publicaciones anteriores, pero nunca llegué a explicar a fondo es Json. Algo que muchos conocen y manejan, pero tal vez otros no.

Json, o JavaScript Object Notation es una forma rápida y cómoda de crear objetos en Javascript.

En muchas ocasiones necesitamos almacenar información de manera ordenada y amigable, como lo hacemos con xml. Json nos da esta posibilidad.

Al ser un objeto está compuesto por propiedades, lo que nos permite guardar información como una variable.

Por ejemplo, podríamos crear un objeto Json con datos de una persona:

var persona = {
 nombre: 'Fernando',
 apellido: 'Gaitan',
 edad: 26,
 activo: true,
 amigos: new Array('Marcela', 'Mauricio', 'Tomas', 'Andres', 'Toni', 'Vanesa')
 };

Como verán, la sintaxis de Json es bastante clara. Como cualquier variable esta declarado con la palabra ‘var’ más el nombre del objeto y para aclararle a nuestro programa que es un json usaremos llaves ({}). Al igual que en un array, cada dato del json se separará con una coma. (propiedad1 , propiedad2 , propiedad3) y estas propiedades podrán guardar cualquier tipo de dato, ya sea un string, un number, un boolean, un array o incluso otro json.

Luego para recuperar los datos del json utilizaremos el nombre del mismo más un punto y el nombre de la propiedad que queremos recuperar. Por ejemplo: si quisieramos recuperar el nombre de la persona, usaríamos:

persona.nombre

Esta nos devolverá el valor: ‘Fernando’.

A su vez, como dije antes, los json son objetos, por tanto como cualquier objeto tiene propiedades, pero también métodos. Los métodos son los comportamientos del json, y así como una propiedad cumple la misma función que una variable, un método cumple la misma función (valga la redundancia) que una función.

Por ejemplo, nosotros podríamos hacer esto:

var persona = {
 nombre: 'Fernando',
 apellido: 'Gaitan',
 edad: 26,
 activo: true,
 amigos: new Array('Marcela', 'Mauricio', 'Tomas', 'Andres', 'Toni', 'Vanesa'),
 saludar: function(){
    return 'Hola soy ' + this.nombre + ' ' + this.apellido;
 },
 getMayorDeEdad: function(){
    if(this.edad > 17){
       return true;
    }else{
       return false;
    }
 }
}

Cómo se ve en el ejemplo, a mi json le agregué dos métodos. Uno que devolverá una cadena con el nombre y apellido de la persona, y otro que devolverá un valor boolean, dependiendo de si la persona es mayor o menor de edad.

También, fijarse en otra cosa, yo dentro de cada método para llamar a una propiedad utilizo la palabra reservada ‘this’, esto también sirve para llamar a métodos del json dentro de otros métodos. Debido a que los métodos creados se encuentran dentro del objeto json.

Si quisieramos llamar a uno de los métodos desde afuera lo haríamos de la siguiente forma:

persona.saludar();

Por ejemplo:

alert(persona.saludar());

Otra forma de crear un json, pero basándose por ejemplo en la respuesta de un servidor es, en el caso de PHP, gracias a la función de este lenguaje json_encode().

Nosotros podemos tener un array asociativo escrito en PHP:

<?php

 $persona = array(
    'nombre' => 'Fernando',
    'apellido' => 'Gaitan',
    'edad' => 26,
    'activo' => true,
    'amigos' => array('Marcela', 'Mauricio', 'Tomas', 'Andres', 'Toni', 'Vanesa')
 );

?>

Y luego convertirlo en un json de javascript de esta forma:

var persona = <?php echo json_encode($persona); ?>

Lo cual nos crearía un objeto json idéntico al primero que mostré.

Esto puede ser muy útil para Ajax, un ejemplo de esto está en este artículo que creé hace unos días Ajax fácil, segunda parte.

Saludos!

 


Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *