Storage.clear() — Methode · JavaScript-Referenz

Signatur

Storage.prototype.clear()

Beschreibung

Die Methode clear() der Schnittstelle Storage löscht auf einen Schlag alle Einträge, die im jeweiligen Speicherobjekt liegen. Sie wird entweder auf window.localStorage (dauerhafter Speicher) oder auf window.sessionStorage (Speicher, der nur für die Sitzung des Tabs gilt) aufgerufen. Anschließend ist length gleich 0.

Typische Einsatzfälle sind das Abmelden (alle zwischengespeicherten Benutzerdaten entfernen), ein „Einstellungen zurücksetzen“-Knopf oder das Aufräumen, wenn sich das Datenformat einer Anwendung geändert hat und alte Daten nicht mehr passen.

Wichtig: clear() wirkt auf den gesamten Speicher des Ursprungs (Protokoll + Host + Port). Teilen sich mehrere Anwendungen oder Bibliotheken denselben Ursprung, werden auch deren Daten gelöscht. Sollen nur die eigenen Schlüssel verschwinden, ist gezieltes Entfernen mit removeItem(), etwa anhand eines Präfixes, die bessere Wahl.

Wenn tatsächlich Einträge vorhanden waren, löst localStorage.clear() in anderen Tabs/Fenstern desselben Ursprungs ein storage-Ereignis aus, bei dem key, oldValue und newValue den Wert null haben.

Rückgabewert

Typ

void

Beschreibung

Kein Rückgabewert (undefined).

Beispiele

Gesamten localStorage leeren

localStorage.setItem('theme', 'dark');
localStorage.setItem('lang', 'de');
console.log(localStorage.length);

localStorage.clear();
console.log(localStorage.length);
console.log(localStorage.getItem('theme'));

2 0 null

Beim Abmelden Sitzungs- und Benutzerdaten entfernen

const logout = async () => {
  await fetch('/api/logout', { method: 'POST', credentials: 'include' });
  sessionStorage.clear();   // Formularentwürfe, Tab-Zustand
  localStorage.clear();     // zwischengespeicherte Profildaten
  location.assign('/login');
};

document.querySelector('#logout')?.addEventListener('click', logout);

Nur eigene Schlüssel löschen statt clear()

const PREFIX = 'myapp:';

const clearOwnKeys = (storage = localStorage) => {
  // Erst Schlüssel sammeln, dann löschen – sonst verschieben sich die Indizes
  const keys = Object.keys(storage).filter((k) => k.startsWith(PREFIX));
  keys.forEach((k) => storage.removeItem(k));
  return keys.length;
};

localStorage.setItem('myapp:cart', '[]');
localStorage.setItem('other-lib:token', 'abc');
console.log(clearOwnKeys());
console.log(localStorage.getItem('other-lib:token'));

1 abc

Auf clear() in anderen Tabs reagieren

window.addEventListener('storage', (event) => {
  if (event.storageArea === localStorage && event.key === null) {
    console.log('localStorage wurde in einem anderen Tab geleert');
    // z. B. UI zurücksetzen oder Nutzer abmelden
  }
});

localStorage wurde in einem anderen Tab geleert

// Wichtig · Fallstricke

Ursprungsweite Wirkung: clear() löscht alle Einträge des Ursprungs – auch die von Drittbibliotheken, Analyse-Skripten oder anderen Anwendungen unter derselben Domain. Im Zweifel mit Präfix und removeItem() arbeiten.
Kein Rückgängigmachen: Die Daten sind sofort und endgültig weg. Wichtige Werte vorher sichern, etwa mit JSON.stringify(Object.entries(localStorage)).
Andere Speicher bleiben: Cookies, IndexedDB, Cache Storage und Service-Worker-Caches werden nicht gelöscht. Für ein vollständiges Aufräumen gibt es serverseitig den HTTP-Header Clear-Site-Data.
sessionStorage gilt pro Tab; sessionStorage.clear() betrifft nur den aktuellen Tab und löst in anderen Tabs kein storage-Ereignis aus.
Zugriffsfehler: Der Zugriff auf localStorage kann eine SecurityError-Ausnahme werfen, z. B. in Sandbox-iframes, bei blockierten Drittanbieter-Cookies oder mit strengen Datenschutzeinstellungen. Den Aufruf deshalb in try...catch packen.
Kompatibilität: Wird von allen modernen Browsern unterstützt (auch ab IE 8). In Node.js gibt es localStorage erst ab neueren Versionen, zunächst experimentell.

Siehe auch

Storage Storage.removeItem() Storage.setItem() Storage.getItem() Storage.key() Storage.length Window.localStorage Window.sessionStorage