Czyszczenie localStorage w javascript?

Jeśli chcesz usunąć określony element lub zmienną z pamięci lokalnej użytkownika, możesz użyć

localStorage.removeItem("name of localStorage variable you want to remove");

window.localStorage.clear(); //try this to clear all local storage

Myślę, że clear(); Usuń wszystkie dane lokalnego magazynu, ale jeśli chcesz usunąć tylko jedną pozycję, możesz użyć:

window.localStorage.removeItem("item_name");

Oto funkcja, która pozwoli Ci usunąć wszystkie elementy localStorage z wyjątkami. Będziesz potrzebował jQuery do tej funkcji. Możesz pobrać gist .

Możesz to tak nazwać

let clearStorageExcept = function(exceptions) {
  let keys = [];
  exceptions = [].concat(exceptions); // prevent undefined

  // get storage keys
  $.each(localStorage, (key) => {
    keys.push(key);
  });

  // loop through keys
  for (let i = 0; i < keys.length; i++) {
    let key = keys[i];
    let deleteItem = true;

    // check if key excluded
    for (let j = 0; j < exceptions.length; j++) {
      let exception = exceptions[j];
      if (key == exception) {
        deleteItem = false;
      }
    }

    // delete key
    if (deleteItem) {
      localStorage.removeItem(key);
    }
  }
};

Po pierwsze, musisz sprawdzić, czy localStorage jest włączona. Polecam zrobić to tak:

var localStorageEnabled = false;
try { localStorageEnabled = !!localStorage; } catch(e) {};

Tak, możesz (w niektórych przypadkach) po prostu sprawdzić, czy localStorage jest członkiem obiektu window. Istnieją jednak opcje sandboxingu iframe (między innymi), które rzucą wyjątek, jeśli nawet spróbujesz uzyskać dostęp do indeksu "localStorage". Tak więc, ze względu na najlepsze praktyki, jest to najlepszy sposób, aby sprawdzić, czy localStorage jest włączone. Następnie możesz po prostu wyczyścić localStorage w ten sposób.

if (localStorageEnabled) localStorage.clear();

Na przykład możesz wyczyścić localStorage po wystąpieniu błędu w przeglądarkach webkit.

// clears the local storage upon error
if (localStorageEnabled)
  window.onerror = localStorage.clear.bind(localStorage);

W powyższym przykładzie Potrzebujesz .bind(window), ponieważ bez niego, funkcja localStorage.clear będzie działać w kontekście obiektu window, zamiast obiektu localStorage, co spowoduje cichą awarię. Aby to zademonstrować, spójrz na poniższy przykład:

window.onerror = localStorage.clear;

Jest tym samym co:

window.onerror = function(){
    localStorage.clear.call(window);
}

localStorage.clear();

Lub

window.localStorage.clear();

Aby wyczyścić dany element

window.localStorage.removeItem("item_name");

Aby usunąć określoną wartość przez id:

var item_detail = JSON.parse(localStorage.getItem("key_name")) || [];           
            $.each(item_detail, function(index, obj){
                if (key_id == data('key')) {
                    item_detail.splice(index,1);
                    localStorage["key_name"] = JSON.stringify(item_detail);
                    return false;
                }
            });

Localstorage jest dołączony do globalnej window. Kiedy logujemy localstorage w narzędziach DevTools chrome, widzimy, że ma on następujące interfejsy API:

Możemy użyć następujących API do usuwania elementów:

1. localStorage.clear(): czyści cały localstorage
2. localStorage.removeItem('myItem'): aby usunąć poszczególne elementy

/ / Upewnij się, że zainstalowałeś pakiet 'store' https://www.npmjs.com/package/store

import 'store' from 'store';

/ / Następnie w kodzie dodaj te 2 linijki:

store.clearAll();
localStorage.clear();