Podsumowanie. Kompletny kod aplikacji w wersji 2.0 aplikacji do zarządzania zadaniami zintegrowanej z localStorage

Poniżej znajduje się cały kod aplikacji w wersji 2.0 zapisanej w pliku todo-app-console-local-storage-snippet w zakładce snippets, która przechowuje zadania w localStorage, dzięki czemu Twoje zadania będą zapisane w pamięci przeglądarki tak długo, aż nie wyczyścisz localStorage!

Spróbuj odświeżyć stronę lub zamknąć przeglądarkę, a potem znowu uruchomić plik - zadania nadal są w pamięci przeglądarki!

Pozwoliłem sobie usunąć komentarze z poniższego kodu, ponieważ widziałeś/aś je już nie raz, a ponadto nasz kod jest wystarczająco czytelny, a funkcje mają właściwe i opisowe nazwy, więc wszystko powinno być jasne.

Gdybyś jednak nie mógł/a sobie przypomnieć, co robią poszczególne funkcje, to zapraszam do odpowiednich fragmentów kursu JavaScript.

console.clear();

function getTasksFromLocalStorage() {
    const storedTasksStringified = localStorage.getItem("tasks");

    const storedTasks = JSON.parse(storedTasksStringified);

    return storedTasks;
}

let tasks = getTasksFromLocalStorage() || [];

function showTasks() {
    console.log("Twoje zapisane zadania:", tasks);
}

function updateTasksInLocalStorage() {
    localStorage.setItem("tasks", JSON.stringify(tasks));
}

function addTask(newTask) {
    tasks.push(newTask);

    updateTasksInLocalStorage();

    console.log("Do Twoich zadań zostało dodane nowe zadanie:", newTask);

    showTasks();
}

function addTaskAtIndex(index, newTask) {
  tasks.splice(index, 0, newTask);

    console.log("Do Twoich zadań zostało dodane nowe zadanie:", newTask);

    updateTasksInLocalStorage();

    showTasks();
}

function deleteTask(index) {
  tasks.splice(index, 1);

    updateTasksInLocalStorage();

    showTasks();
}

function deleteAllTasks() {
  tasks = [];
    
    console.log("Wszystkie zadania zostały usunięte...");

    updateTasksInLocalStorage(tasks);
    
    showTasks();
}

// odpalając program, wyświetlamy zapisane zadania na start:
showTasks();