freeCodeCamp/guide/spanish/miscellaneous/store-data-in-web-browsers-.../index.md

3.4 KiB

title localeTitle
Store Data in Web Browsers Storage Almacenar datos en almacenamiento de navegadores web

Para administrar los datos que maneja su aplicación web, no necesariamente necesita una base de datos. Las respectivas funciones de almacenamiento del navegador son compatibles con Chrome (versión 4 y superior), Mozilla Firefox (versión 3.5 y superior) e Internet Explorer (versión 8 y superior), y una gama de otros navegadores, incluidos los de iOS y Android.

Hay dos posibilidades principales para el almacenamiento del navegador:

1. Almacenamiento local

Cualquier contenido / datos guardados en el objeto localStorage estará disponible después de que el navegador haya sido reiniciado (cerrado y abierto nuevamente). Para guardar un elemento en localStorage , puede usar el método setItem() . Este método debe entregarse una clave y un valor.

Example: localStorage.setItem("mykey","myvalue"); 

Para recuperar el elemento de localStorage , se debe usar el método getItem . El método getItem debe recibir la clave de los datos que desea recuperar:

  Example: localStorage.getItem("mykey"); 

Puede eliminar un elemento de localStorage utilizando el método removeItem() . Este método debe entregarse la clave del elemento que se va a eliminar:

  Example: localStorage.removeItem("mykey"); 

Para borrar todo el localStorage , debe usar el método clear() en el objeto localStorage :

  Example: localStorage.clear(); 

2. sessionStorage

Los elementos guardados en el objeto sessionStorage permanecerán hasta que el usuario cierre el navegador. Entonces, el almacenamiento se borrará.

Puede guardar un elemento en sessionStorage , use el método setItem() en el objeto sessionStorage :

Example: sessionStorage.setItem("mykey","myvalue"); 

Para recuperar el elemento del sessionStorage , se debe usar el método getItem . El método getItem debe recibir la clave de los datos que desea recuperar:

  Example: sessionStorage.getItem("mykey"); 

Puede eliminar un elemento de sessionStorage utilizando el método removeItem() . Este método debe entregarse la clave del elemento que se va a eliminar:

  Example: sessionStorage.removeItem("mykey"); 

Para borrar todo el sessionStorage , debe usar el método clear() en el objeto sessionStorage :

  Example: sessionStorage.clear(); 

Guardar arrays en localStorage y sessionStorage

No solo puede guardar valores individuales en localStorage y sessionStorage , sino que también puede guardar el contenido de una matriz.

En este ejemplo, tenemos una matriz con números:

var ourArray =[1,2,3,4,5]; 

Ahora podemos guardarlo en localStorage o sessionStorage usando el método setItem() :

localStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 

o, para sessionStorage :

sessionStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 

Para guardarse, primero se debe convertir la matriz en una cadena. En el ejemplo que se muestra arriba, estamos usando el método JSON.stringify para lograr esto.

Cuando recupere nuestros datos de localStorage o sessionStorage , vuelva a convertirlos en una matriz:

var storedArray = localStorage.getItem("ourarraykey"); 
 ourArray = JSON.parse(storedArray); 

o, para sessionStorage :

var storedArray = sessionStorage.getItem("ourarraykey"); 
 ourArray = JSON.parse(storedArray);