Tablice. splice() i usuwanie elementów | Usuwanie zadań z listy

Ok, więc inicjujemy listę zadań, dodajemy i przechowujemy zadania w kodzie, czas więc na kolejną funkcjonalność - usuwanie zadania z listy. Powinniśmy być w stanie usunąć zadanie, które jest już nieaktualne albo wykonane z naszej listy, żeby się nie rozpraszać oraz widzieć nasz progres.

Usunięcia konkretnego elementu z tablicy można dokonać na kilka sposobów. Ze względu na to, że wiemy, czym są indeksy oraz nasza lista pozwala na wyświetlenie indeksów każdego z zadań, najłatwiej będzie sprawdzić, jaki jest indeks zadania, które chcemy usunąć, a potem użyć wbudowanej metody tablicy splice() w ten sposób:

// załóżmy, że chcemy usunąć zadanie o indeksie 4:

tasks.splice(4, 1);

Metoda splice() w tym przypadku potrzebuje przekazania do niej dwóch argumentów:

• pierwszy (w naszym przykładzie jest to 4) jest indeksem elementu, który chcemy usunąć,
• drugi z kolei wskazuje na ilość elementów, które chcemy usunąć, zaczynając od tego indeksu (my chcemy usunąć tylko jedno zadanie, więc napiszemy 1).

Spróbuj usunąć drugie zadanie w konsoli (pamiętaj, że indeksem drugiego zadania jest... 1).

Metoda splice() służy nie tylko do usuwania pojedynczych elementów z tablicy.

Można z niej korzystać także, by usunąć ileś elementów zacznając od określonego indeksu:

let letters = ["a", "b", "c", "d", "e"];

// usuń 3 elementy, zaczynając od drugiego indeksu:
letters.splice(2, 3);

console.log(letters);

Ponadto, w przypadku usuwania elementów z tablicy, splice() nie tylko usuwa elementy z tablicy, modyfikując ją, ale także jednocześnie zwraca nową talicę, w której zawarte są usunięte elementy, którą to tablicę możemy np. przypisać do zmiennej:

let letters = ["a", "b", "c", "d", "e"];

// usuń 3 elementy, zaczynając od drugiego indeksu
// i przypisz usunięte elementy do nowej tablicy removedLetters: 
let removedLetters = letters.splice(2, 3);

console.log("letters:", letters);
console.log("removedLetters:", removedLetters);

To może być bardzo przydatne, jeśli chcemy później wykorzystać usunięte elementy, np. w powyższym przykładzie wypisaliśmy usunięte litery w konsoli - gdybyśmy ich nie zapisali w zmiennej, to zostałyby one utracone na zawsze.

Pamiętaj tylko, że jeśli usuniesz jeden element, to splice() zwróci ten jeden element, ale w tablicy! W związku z tym, gdybyś chciał/a zapisać samą wartość usuniętego elementu, to należy ją "wyciągnąć" za pomocą indeksu 0 ze zwróconej tablicy:

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

// usuń "sprawdzić maila" z listy zadań (indeks 1),
// przypisz usunięte zadanie do tablicy removedTasks,
// wyciągnij usunięte zadanie z tablicy removedTasks i przypisz do zmiennej removedTask:

let removedTasks = tasks.splice(1, 1); // zwraca tablicę
let removedTask = removedTasks[0]; // wyciągamy zadanie z tablicy

console.log("Usunięte zadania:", removedTasks);
console.log("Zadanie", removedTask, "zostało usunięte z listy...");
console.log("Zauktualizowane zadania po usunięciu zadania:", tasks);