Seznamy

Seznam může obsahovat jakékoliv položky. V programu s nimi pak můžeme přehledným způsobem pracovat.

Vytvoření seznamu

Jednotlivé položky napíšeme do hranatých závorek a oddělíme čárkou. Například:

var seznam = ["Maxi", "Tomáši", "Mary", "Valentino", "Natálie", "Karolino", "Kateřino", "Kateřino", "Agáto" "Josefe", "Filipe", "Anno", "Lauro", "Šimone", "Michale", "Mariáne", "Jakube", "Martine", "Veroniko", "Ivane", "Františku", "Martine", "Luisi"];

Cyklus

Můžeme celý seznam projít a s každou položkou jednotlivě něco udělat. Následující ukázka postupně pozdraví všechny osoby v seznamu:

<b>for</b> (var <u>jmeno</u> <b>of</b> seznam) {
    console.log("Ať se vám daří, " + <u>jmeno</u>);
}

Podívejme se ještě na složitější ukázku, která kolem každého jména vytvoří značku <li> a celý výsledný slepenec přidá na správné místo do stránky.

<ul>
tady zatím nic není.
</ul>
<script>
var vysledek = "";
var seznam = ["Hynku", "Viléme", "Jarmilo"];
for (var jmeno of seznam) {
    vysledek += "<li>" + jmeno + "</li>";
}
document.querySelector("ul").innerHTML = vysledek;
</script>

Cykly v šabloně na serveru

Ve webové aplikaci můžeme používat cykly, aby nám automaticky vytvářely kusy stránky. Podobá se to předchozí ukázce, ale kód je výrazně jednodušší.

Aby bylo co vypisovat, musíme v souboru app.js předat šabloně nějaký seznam. Například tedy budeme renderovat stránku takhle:

app.get("/", function (req, res) {
    res.render("hlavni_strana", {<u>seznam: ["Hynku", "Viléme", "Jarmilo"]</u>, layout: false});
});

V samotné šabloně views/hlavni_strana.html pak použijeme cyklus #each. Chová se obdobně jako minulá ukázka, jen se píše jinak:

<div class=nahore>
{{#each seznam as |jmeno|}}
<li>{{jmeno}}</li>
{{/each}}
</div>

Tenhle kód si nemůžeme ukázat tak snadno, protože se spouští na serveru a prohlížeč dostane až hotový výsledek. To znamená, že se nám prostě ukáže seznam se jmény.

Přidávání do seznamu

Do programu můžete přidávat položky. Položku na konec přidáme funkcí .push:

var seznam = [10, 20];
seznam.push(30);

Na začátek pole můžeme přidávat funkcí .unshift:

var seznam = [20, 30];
seznam.unshift(10);

Indexování

Když se chceme podívat na jeden prvek seznamu, můžeme použít indexování s hranatými závorkami. Například první prvek získáme pomocí indexu [0]:

var seznam = ["Tohle se vypíše", "Tohle ne", "Tohle taky ne."];
console.log(seznam[0]);

Následující prvky by měly čísla 1, 2 atd. Celkový počet prvků získáme jako seznam.length.