Dodawanie, pobieranie i usuwanie prostych danych tekstowych z localStorage

Żeby dodać proste dane tekstowe do localStorage, trzeba użyć mniej więcej takiego kodu (nie wpisuj go na razie w konsoli):

localStorage.setItem("nazwaKlucza", "wartośćKlucza");

setItem() jest jedną z metod obiektu localStorage, dzięki której możemy przypisać wartość do jakiegoś klucza, podobnie jak przypisujemy wartość do zmiennej, tyle że zarówno nazwa klucza, jak i jego wartość mają być ujęte w cudzysłów.

Spróbuj zapisać lub zaktualizować swoje imię w localStorage w ten sposób:

localStorage.setItem("name", "TutajWpiszSwojeImię");

i kliknij Enter, po czym wpisz localStorage i znowu kliknij Enter, by zobaczyć, że nowy klucz jest teraz w obiekcie.

Uwaga! Metoda setItem() zawsze nadpisuje poprzednią wartość klucza. Jeśli dany klucz nie istniał wcześniej, zostanie utworzony, jeśli istniał - jego wartość zostanie nadpisana przez nową wartość.

Żeby pobrać jakiś klucz z localStorage, należy użyć metody getItem(), podając w nawiasach nazwę klucza w cudzysłowiu, np. tak:

localStorage.getItem("name");

Spróbuj pobrać zapisane przez siebie imię z localStorage.

Pobrane dane z localStorage możemy przypisać do zmiennej, by móc nimi operować w naszym programie. Można to zrobić w następujący sposób:

let name = localStorage.getItem("name");

console.log("Imię zapisane w localStorage:", name);

Żeby usunąć jakiś klucz (i odpowiednio jego wartość) z localStorage, trzeba użyć wbudowanej metody removeItem(), podając w nawiasach nazwę klucza w cudzysłowiu, np. tak:

localStorage.removeItem("name");

console.log(localStorage.getItem("name")); // konsola zwróci wartość null, co znaczy że nie ma takiej wartości

Spróbuj teraz usunąć klucz name z localStorage, a potem sprawdź, czy na pewno został usunięty.