La gestion du stockage en JavaScript

Introduction au stockage en JavaScript

Le Stockage en JavaScript permet d'ajouter, de modifier et de supprimer des paires clé/valeur. Les clés et les valeurs stockées sont toujours des chaînes de caractères au format UTF-16. Les clés numériques sont converties en chaînes. Le stockage de session pour un domaine est accessible via un objet nommé sessionStorage. D'autre part, le stockage local est géré par un objet appelé localStorage.

Différences entre localStorage et sessionStorage

Les deux principaux objets de stockage sont :

• localStorage : Les données sont enregistrées pour l'origine du document et persistent entre les sessions de navigateur. Ces données n'ont pas de date d'expiration.
• sessionStorage : Les données sont également stockées pour l'origine du document, mais elles ne persistent que durant la session de navigateur en cours.

Particularités des objets Storage

À noter que l'objet Storage est spécifique au protocole du document. Ainsi, localStorage ou sessionStorage pour http://codecademy.com sera différent de ceux pour https://codecademy.com.

Une autre remarque importante : le comportement des objets Storage pour les documents chargés à partir de la filesystem locale (par exemple file:) est indéfini. De nombreux navigateurs définissent un objet Storage séparé pour chaque URL file:, mais il n'est pas recommandé de s'appuyer sur ce comportement.

Exemple d'utilisation du localStorage

Voici un exemple montrant comment ajouter une paire clé/valeur à localStorage, la récupérer et la supprimer :

// Ajoute une clé/valeur au localStorage
localStorage.setItem('dataKey', 'dataValue');

// Récupère la valeur de la clé
const data = localStorage.getItem('dataKey');
console.log(data); // Affiche : dataValue

// Supprime la clé du localStorage
localStorage.removeItem('dataKey');

Méthodes et propriétés de l'objet Storage

Voici une liste des principales méthodes et propriétés de l'objet Storage :

• Storage.clear() : Supprime toutes les clés dans un objet Storage.
• Storage.getItem(key) : Retourne la valeur de la clé donnée dans l'élément de données.
• Storage.length : Retourne le nombre d'éléments dans un tableau ou le nombre de caractères dans une chaîne.
• Storage.removeItem(key) : Supprime une paire clé-valeur du stockage local en fonction de la clé spécifiée.
• Storage.setItem(key, value) : Met à jour la valeur de la clé spécifiée dans l'objet de stockage, ou ajoute la clé si elle n'existe pas.