5 situaciones en donde podemos usar los métodos JSON.stringify y JSON.parse en JavaScript

Javascript

Demo

El popular formato para el intercambio de datos JSON (JavaScript Object Notation) fue creado en un inicio para que funcione solo en JavaScript, pero muchos otros Lenguajes de Programación como Go, PHP, Python, Java, entre otros, utilizan este formato para compartir datos entre el cliente y el servidor, en JavaScript existen los métodos JSON.stringify y JSON.parse los cuales pueden ser utilizados en ciertas situaciones las cuales te compartiré en este Post. 

Antes de continuar con este Post te invito a escuchar el Podcast: Si No Tienes Experiencia Para Un Puesto De Trabajo, Créala !

Sound Cloud:

Spotify:

Bien ahora continuemos con el Post: 5 situaciones en donde podemos usar JSON.stringify y JSON.parse

Las situaciones en donde podemos usar los métodos JSON.stringify y JSON.parse son muchas, esto varia según el proyecto que se este realizando, vamos a conocer un poco sobre estos 2 métodos:

JSON.stringify()

Este método convierte un objeto o valor en una cadena de texto JSON, opcionalmente reemplaza valores si se indica una función de reemplazo, o si se especifican las propiedades mediante un array de reemplazo.

JSON.parse()

Este método analiza una cadena de texto como JSON, transformando opcionalmente el valor producido por el análisis.

A continuación te presento 5 situaciones interesantes.

Almacenar y leer datos de localStorage o sessionStorage

Las propiedades localStorage y sessionStorage nos permiten guardar pares de clave – valor en un Navegador Web. La propiedad localStorage solo puede guardar Strings, por lo que si necesitamos almacenar objetos debemos de convertirlos a Strings usando el método JSON.stringify.

No podemos pedirle a localStorage que almacene un objeto directamente porque almacenará [object Object].

Asimismo debemos usar el método JSON.parse al obtener los datos de localStorage, veamos el siguiente ejemplo:

Si hago un console.log(datosUsuario); obtendré los datos del usuario almacenado en localStorage.

Obtener datos de un servidor con XMLHttpRequest

El objeto XMLHttpRequest nos permite obtener datos de una API REST alojada en un servidor, los datos que obtenemos son Strings, para poder leerlos neesitamos pasarle el método JSON.parse, veamos el siguiente ejemplo:

Si ejecuto console.log(postres); obtendré los datos desde la ruta o URL que he especificado.

JSON.stringify al cuerpo de una solicitud POST

Cuando enviamos una solicitud al servidor utilizando el método POST, en algunas ocasiones necesitamos pasarle el método JSON.stringify, como en el siguiente ejemplo:

Si ejecuto console.log(contenido); en la consola del Navegador Google Chrome, obtendré una lista de datos desde la ruta o URL especifica, haciendo uso del método POST.

Copiado profundo de un Objeto JavaScript

A veces copiar objetos en JavaScript puede ser complicado, existen diferentes maneras de realizar una copia superficial, que es el comportamiento predeterminado en la mayoría de los casos. Pero puede ser mucho más difícil hacer una copia profundo de un objeto.

Haciendo uso del método JSON.stringify podemos crear una copia profunda de un objeto en JavaScript:

Si ejecuto console.log(postre); y console.log(copiarPostre); en la consola de Google Chrome obtendré los valores de la variable postres y una copia de la variable postres. Con solo indicar el nombre del postre se crea una copia con todos los valores correspondientes.

Convertir cualquier tipo de Datos en un String

Con el método JSON.stringify podemos convertir cualquier tipo de datos en un String, a continuación varios tipos de datos que se convierten a String:

Cuando se desarrolla una aplicación con JavaScript en algunas ocasiones es necesario serializar los datos en Strings para almacenarlos en una Base de Datos o para enviarlos a una API REST. Los datos tienen que esas en formato de Strings.

Te invito a leer los artículos Que es API REST + Mejores Prácticas y Tipos de Datos que podemos usar en JSON, para que estés más familiarizado con esta tecnología.

Conclusión

Si eres sabio le puedes sacar provecho a los métodos JSON.stringify y JSON.parse, los cuales pueden ser muy útiles cuando el código de una aplicación se presta para su uso.

Nota(s)

  • Los métodos y pasos mencionados en este este Post, pueden quedar descontinuados, continuar o ser modificadas, esto no dependen de mí si no de los Desarrolladores que dan soporte a JavaScript.
  • No olvides que debemos usar la Tecnología para hacer cosas Buenas por el Mundo.

 

Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenido.

Newsletter

Suscríbete a Nuestro Boletín de Novedades:

(Luego de la suscripción no te va salir ningun mensaje. Solo revisa tu bandeja de Correo para confirmar tu suscripción)
* indicates required

Comentarios

avatar
  Subscribirse  
Notificar a