JSON
JSON (acrónimo de JavaScript Object Notation, su traducción es: notación de objeto de JavaScript) es un formato de texto ligero para el intercambio de datos. Es una forma de almacenar información de manera organizada y de fácil acceso; legible por humanos para transmitir datos a los que podemos acceder de una manera realmente lógica.
Cuando se intercambian datos entre un navegador y un servidor, los datos solo pueden ser de texto; JSON al ser solo texto permite convertir cualquier objeto JavaScript en JSON y ser enviado al servidor. También podemos convertir cualquier JSON recibido por el servidor en objetos JavaScript. De esta manera podemos trabajar con los datos como objetos de JavaScript, sin análisis y traducciones complicadas.
Su uso es por la comunicación asíncrona entre el navegador y el servidor.
Soporta los siguientes datos: números (enteros y flotantes), cadenas, booleanos, arreglos, objetos (representación de matrices) y un valor vacío (null).
Ejemplos
Almacenamiento.
Un dato.
var carlos = { "age" : "26", "hometown" : "México, Mx", "gender" : "masculino" };
Para imprimir la información se usa:
document.write('Carlos tiene ' carlos.age); // La salida es 26
Para dos o más datos puede hacer un arreglo.
var grupo = [{ "name" : "Paola", "age" : "30", "hometown" : "México, Mx", "gender" : "femenino" }, { "name" : "Carlos", "age" : "26", "hometown" : "México, Mx", "gender" : "masculino" }];
Y se imprime así.
document.write(grupo[1].name); // Escribe Carlos document.write(grupo[0].age); // La salida es 30
Envio de datos.
var miObjeto = { name: "Paola", age: 30, hometown: "México, Mx" }; //Se define un objeto. var miJSON = JSON.stringify(miObjeto); //Se transforma el objeto a cadena JSON. window.location = "demo_json.php?x=" + myJSON; // Envía una solicitud al archivo PHP, con la cadena JSON como parámetro al objeto window.location.
Recibiendo información.
var miJSON = '{"name":"Paola", "age":"30", "hometown":"México, Mx"}'; var miObjeto = JSON.parse(miJSON); //Se transforma la cadena JSON a un objeto. document.getElementById("demo").innerHTML = miObjeto.name; //Obtener el elemento con el ID especificado (demo) y devuelve el contenido HTML (HTML interno) del elemento "miObjeto.name", en otras palabras cambia el contenido HTML del elemento.