LocalSession & LocalStorage

Les propriétés sessionStorage et localStorage sont des objets de storage (en quelque sorte des bases de données) à même le navigateur permettant aux sites et aux applications de stocker et d’accéder à diverses informations.

La différence principale entre les deux est la durée de stockage. Les informations stockées via sessionStorage sont gardées en mémoire uniquement le temps d’une session. Autrement dit, les informations sont effacées lorsque l’onglet ou encore le navigateur est fermé. Tandis que les données sauvegardées via localStorage sont disponibles tant et aussi longtemps que l’usager ne les efface pas.

Examinons les méthodes disponibles de sessionStorage et localStorage.

setItem

La méthode setItem() permet de sauvegarder des informations dans l’objet de storage choisi (sessionStorage ou localStorage). Pour ce faire, il faut lui passer deux paramètres: une clé spécifiant le nom de référence de l’information et l’information elle-même.

Par exemple, pour sauvegarder le nom d’un usager:

localStorage.setItem(“user”, “Dwayne Johnson”);

où la clé est “user” et la valeur est “Dwayne Johnson”.

getItem

La méthode getItem() permet de récupérer une information stockée dans le navigateur. Cette méthode n’accepte qu’un seul paramètre, soit le nom de la clé correspondant à l’information désirée.

Par exemple, pour récupérer le nom d’un usager:

localStorage.getItem(“user”); // “Dwayne Johnson”

removeItem

La méthode removeItem() permet de supprimer une clé dans l’objet de storage.

Par exemple, si l’usager spécifie qu’il veut que l’information contenant son nom soit effacée du site, il est possible de le faire:

localStorage.removeItem("user"); 

clear

La méthode clear(), tout comme la méthode removeItem() permet d’effacer des informations. À la différence près que clear() n’accepte pas de paramètre et efface donc toutes les informations sauvegardées.

localStorage.clear();