Dodawanie tablicy do localStorage (JSON.stringify()) | Zapisujemy nasze zadania w localStorage

Zapisanie bardziej złożonych struktur danych w localStorage wymaga dodatkowej czynności. Kiedy np. chcemy przechować lub nadpisać tablicę (a będziemy chcieli przechować tablicę z naszymi zadaniami), to musimy przekształcić ją na postać tekstową (stąd nazwa metody stringify(), czyli coś w rodzaju przekształć w string (ciąg znaków)) i przypisać do klucza:

localStorage.setItem("tasks", JSON.stringify(["zrobić kawę", "sprawdzić maila", "zajrzeć na stronę kodujemywbiurze.pl"]))

Powyższy kod wygląda strasznie 😬, ale zaraz "rozbijemy" go na mniejsze polecenia i rozłożymy na czynniki pierwsze.

Zwróc uwagę, że do metody setItem() przekazaliśmy najpierw tak, jak wcześniej, nazwę klucza "tasks" w cudzysłowiu, natomiast drugim argumentem nie jest po prostu tablica, tylko tablica przekazana jako argument do metody JSON.stringify(), która zwraca tablicę w ciąg znaków.

Bardziej klarownym i czytelnym rozwiązaniem byłoby najpierw przypisać tablicę do zmiennej, a potem zmienną przekazać do JSON.stringify():

let tasks = ["zrobić kawę", "sprawdzić maila", "zajrzeć na stronę kodujemywbiurze.pl"];

localStorage.setItem("tasks", JSON.stringify(tasks));

Możemy też ten kod rozbić jeszcze bardziej:

let tasks = ["zrobić kawę", "sprawdzić maila", "zajrzeć na stronę kodujemywbiurze.pl"];
let tasksStringified = JSON.stringify(tasks);

localStorage.setItem("tasks", tasksStringified);