Umiemy zadeklarować zmienną. Wiemy że zmienna przyjmuje tylko jedną wartość w danym czasie, więc nasuwa się pytanie, a co jeżeli muszę zapamiętać pewną liczbę zmiennych, jednak nie mogę z góry określić ile ich będzie. Rozwiązaniem tego problemu są tablice. Są one najprościej mówiąc zmiennymi, które przechowują inne zmienne.
Na początek powinniśmy zadeklarować naszą tablicę. Służy do tego konstrukcja new Array().Wygląda to w taki sposób.
let tablica = new Array()
Alternatywną metodą jest użycie nawiasów kwadratowych. Pomiędzy nimi umieszczamy wartości, które chcemy w nich przechować.
let tablica = [1,2,3,4,5]
Każda zmienna w tablicy posiada indeks, pozwalający do niej dotrzeć. Indeksy zaczynają się od 0 i rosną o jeden wraz z każdym elementem. Oznacza to że pierwszy element ma indeks o wartości 0, drugi element to indeks równy 1 itd. Aby dostać się do pożądanej zmiennej należy podać obok nazwy tablicy jej indeks umieszczony wewnątrz nawiasów kwadratowych. Na przykład:
<script>
let tablica = ["Ala ","ma ","kota"]
document.write(tablica)
document.write(tablica[1])
</script>
W tym wypadku program najpierw wypisze Ala ma kota, a następnie samo słowo ma. Dzięki temu, że tablice posiadają liczbowe rosnące indeksy, idealnie współpracują z pętlami. Zwłaszcza często do skakania po tablicach używa się pętli for, jednak w JS’ie możemy spotkać pętlę foreach, która została zaprojektowana specjalnie do współpracy z tablicami. Jej implementacja wygląda następująco:
<script>
let tab = [1,2,3,4,5,6]
tab.forEach(elementTablicy => {
document.write(elementTablicy)
})
</script>Wynikiem jest wyświetlenie wszystkich elementów tablicy. Oczywiście zamiast console.log możemy wstawić dowolny zestaw poleceń. Jak widać zastosowałem tutaj anonimową funkcję strzałkową (nieposiadającą nazwy), jest to często spotykany zabieg w JS’ie.
Kolejną istotną metodą tablic, jest filter, pozwala ona przeskakiwać tylko po elementach tablicy spełniających określony warunek. Oto przykład:
<script>
let tab = [1,2,3,4,5,6]
let result = tab.filter(elementTablicy => elementTablicy>4)
document.write(result)
</script>
Uzyskanym wynikiem jest tablica obiektów zawierająca dwie liczby czyli 5 oraz 6.
Do tablicy możemy także dołączyć pewną zmienną. Służy do tego metoda push. Oto przykładowa implementacja:
<script>
let tab = ['lis', 'łoś', "kuna", "jeleń"];
tab.push('tygrys');
console.log(tab);
</script>Oto wynik polecenia:
[ 'lis', 'łoś', 'kuna', 'jeleń', 'tygrys' ]
Oczywiście to nie są wszystkie możliwości tablic. W celu uzupełnienia wiedzy z tego wpisu zapraszam do zapoznania się dokumentacja mdn.
