« anterior | siguiente »

Home > 2006 > Julio > Miércoles, 12 de Julio 2006 > Introducción a JSON
Blogs Media: CSS Mania | VivirLatino | Sentido Web | Apps Mania

Publicidad

Mié12Jul2006

Introducción a JSON

17:00 H (CET)| Temas: Javascript

JSON (JavaScript Object Notation) es un formato para intercambiar datos sencillos, entendiendo como sencillos el texto, los números y los valores lógicos, pudiendo estar organizados en estructuras.

La información en JSON se envia mediante un objeto, el cual está formado por pares atributo-valor. El atributo es un identificativo, y el valor puede estar formado por texto, números, valores lógicos (true o false), el valor vacío (null), otros objetos o arrays. Por ejemplo, un objeto puede tener sus propiedades de texto, de números, una propiedad que tenga un array de números y una propiedad que tenga un objeto parecido a sí mismo.

La definición del lenguaje sería la siguiente:

objeto
  {}
  { miembros } 
miembros
  atributo : valor
  miembros , atributo : valor
array
  []
  [ elementos ]
elementos
  valor
  elementos , valor
valor
  texto
  números
  objetos
  array
  true
  false
  null

Veamos un ejemplo para poder entenderlo mejor, queremos mostrar un pequeño árbol genealógico, que muestre a los abuelos, sus hijos y los hijos de éstos, junto a sus parejas:

{
  "padres": [
    {"nombre": "Abuelo", "sexo": "M", "edad": "60"},
    {"nombre": "Abuela", "sexo": "F", "edad": "58"}
  ],
  "hijos": [
    {"nombre": "Papá", "sexo": "M", "edad": "40", 
     "familia": {
       "pareja": {"nombre": "Mamá", "sexo": "F", "edad": "39"},
       "hijos": [
         {"nombre": "Hijo 1"},
         {"nombre": "Hijo 2"}
	   ]
     } 
    },
    {"nombre": "Tía", "sexo": "F", "edad": "38"}
  ]
}

Su uso en javascript es muy sencillo, tan solo tendríamos que igualar la definición del objeto JSON a una variable, o si el texto que representa el objeto nos llega mediante AJAX evaluarlo (usando eval).

var familia = {
  "padres": [
    {"nombre": "Abuelo", "sexo": "M", "edad": "60"},
    {"nombre": "Abuela", "sexo": "F", "edad": "58"}
  ]
};

o

var familia = eval('('+'{"padres": [{"nombre": "Abuelo", "sexo": "M", "edad": "60"}, {"nombre": "Abuela", "sexo": "F", "edad": "58"}]}'+')');

Para navegar por el objeto los arrays se usarán como normalmente en Javascript y los atributos como propiedades del objeto.

familia.padres[0].nombre

Más información