JSON (JavaScript Object Notation)
< Anterior Siguiente >JSON, o JavaScript Object Notation, es un formato de texto ligero para el intercambio de datos. JSON es completamente independiente del lenguaje, pero utiliza convenciones que son familiares para los programadores de lenguajes como C, C++, Java, JavaScript, Perl, Python, y muchos otros.
JSON se utiliza principalmente para transmitir datos entre un servidor y una aplicación web como texto sin formato. Este formato es fácil de leer y escribir para los humanos, y fácil de analizar y generar para las máquinas.
¿Cómo es la estructura de un objeto JSON?
La estructura básica de JSON es una colección de pares clave/valor. Cada clave es una cadena (string) seguida de dos puntos (:
), y el valor puede ser un número, una cadena, un valor booleano (true
o false
), un array (lista), otro objeto JSON o null
.
Ejemplo de un Objeto JSON Simple
Veamos un ejemplo básico de un objeto JSON que representa un usuario:
{
"nombre": "Juan",
"edad": 30,
"ciudad": "Madrid",
"isActive": true
}
En este ejemplo, "nombre", "edad", "ciudad" y "isActive" son claves, y sus valores correspondientes son "Juan" (cadena), 30 (número), "Madrid" (cadena) y true
(booleano).
Uso de JSON en JavaScript
JavaScript ofrece dos métodos globales para trabajar con JSON: JSON.parse()
y JSON.stringify()
. Estos métodos nos permiten convertir texto en objetos JavaScript y viceversa.
Convertir JSON a un Objeto JavaScript: JSON.parse()
El método JSON.parse()
analiza una cadena JSON, construyendo el valor o el objeto JavaScript descrito por la cadena. Esto es útil cuando se recibe datos JSON de un servidor y se desea utilizarlo como un objeto JavaScript.
Ejemplo:
var jsonString = '{"nombre": "Juan", "edad": 30, "ciudad": "Madrid", "isActive": true}';
var objetoUsuario = JSON.parse(jsonString);
console.log(objetoUsuario.nombre); // Salida: Juan
console.log(objetoUsuario.edad); // Salida: 30
console.log(objetoUsuario.ciudad); // Salida: Madrid
console.log(objetoUsuario.isActive); // Salida: true
En este ejemplo, JSON.parse()
convierte la cadena JSON en un objeto JavaScript, permitiéndonos acceder a sus propiedades de manera nativa.
Convertir un Objeto JavaScript a una Cadena JSON: JSON.stringify()
El método JSON.stringify()
convierte un objeto o valor de JavaScript en una cadena JSON. Esto es útil para enviar datos a un servidor en formato JSON.
Ejemplo:
var objetoUsuario = {
nombre: "Juan",
edad: 30,
ciudad: "Madrid",
isActive: true
};
var jsonString = JSON.stringify(objetoUsuario);
console.log(jsonString); // Salida: {"nombre":"Juan","edad":30,"ciudad":"Madrid","isActive":true}
En este caso, JSON.stringify()
convierte el objeto JavaScript en una cadena JSON, adecuada para el intercambio de datos.
Arrays en JSON
JSON también puede representar arrays, que son listas ordenadas de valores. Los arrays en JSON se definen entre corchetes ([]
) y pueden contener cualquier tipo de datos, incluyendo otros objetos JSON.
Ejemplo de un Array JSON:
[
{"nombre": "Camisa", "precio": 25, "disponibilidad": true},
{"nombre": "Pantalones", "precio": 40, "disponibilidad": false},
{"nombre": "Zapatos", "precio": 60, "disponibilidad": true}
]
En este ejemplo, el array JSON contiene tres objetos que representan productos, cada uno con propiedades como nombre
, precio
, y disponibilidad
.
Ejemplo de Uso Práctico de JSON en JavaScript
Supongamos que tienes una aplicación web donde necesitas enviar datos de una lista de productos desde el cliente al servidor. Puedes usar JSON.stringify()
para convertir un array de objetos JavaScript a una cadena JSON.
Producto | Precio | Disponibilidad |
---|---|---|
Camisa | 25 | true |
Pantalones | 40 | false |
Zapatos | 60 | true |
var productos = [
{ "nombre": "Camisa", "precio": 25, "disponibilidad": true },
{ "nombre": "Pantalones", "precio": 40, "disponibilidad": false },
{ "nombre": "Zapatos", "precio": 60, "disponibilidad": true }
];
var jsonProductos = JSON.stringify(productos);
console.log(jsonProductos);
El resultado es una cadena JSON que puede ser enviada fácilmente al servidor utilizando una solicitud HTTP.