tablice

Tablica to zmienna specjalnego typu, które przechowuje listę wartości.
Użycie tablicy należy rozważyć podczas pracy z listą (np. zakupów) lub zbiorem powiązanych ze sobą wartości.

utworzenie i wywołanie tablicy

<script type="text/javascript">
var kolory = ["żółty", "pomarańczowy", "czerwony"];
document.write(kolory + "<br />");
document.write(kolory[0] + "<br />");
document.write(kolory[1] + "<br />");
document.write(kolory[2] + "<br />");

var kolorPierwszy = kolory[0];
var kolorDrugi = kolory[1];
var kolorTrzeci = kolory[2];
document.write(kolorPierwszy + "<br />");
document.write(kolorDrugi + "<br />");
document.write(kolorTrzeci);
</script>

wynik skryptu




<script type="text/javascript">
var kolory = Array("żółty", "pomarańczowy", "czerwony");
document.write("kolory[0] = " + kolory[0] + "<br />");
document.write("kolory[1] = " + kolory[1] + "<br />");
document.write("kolory[2] = " + kolory[2] + "<br />");
</script>

wynik skryptu




<script type="text/javascript">
var colours = ["yellow", "orange", "red"];
document.write("colours[0] = " + colours[0] + "<br />");
document.write("colours[1] = " + colours[1] + "<br />");
document.write("colours[2] = " + colours[2] + "<br />");
</script>

wynik skryptu

odczyt zawartości tablicy w pętli for

W przypadku pętli for musimy znać rozmiar tablicy kolory.length.

<script type="text/javascript">
var kolory = Array("żółty", "pomarańczowy", "czerwony");
for (var i = 0; i < kolory.length; i++) {
    document.write("kolory[" + i + "] = " + kolory[i] + "<br />");
}
</script>

wynik skryptu




<script type="text/javascript">
var colours = ["yellow", "orange", "red"];
for (var i = 0; i < kolory.length; i++) {
    document.write("colours[" + i + "] = " + colours[i] + "<br />");
}
</script>

wynik skryptu

odczyt zawartości tablicy w pętli for...in

W przypadku pętli for...in nie musimy znać rozmiaru tablicy.

<script type="text/javascript">
var kolory = Array("żółty", "pomarańczowy", "czerwony");
for (var indeks in kolory) {
    document.write("kolory[" + indeks + "] = " + kolory[indeks] + "<br />");
}
</script>

wynik skryptu




<script type="text/javascript">
var colours = ["yellow", "orange", "red"];
for (var indeks in colours) {
    document.write("colours[" + indeks + "] = " + colours[indeks] + "<br />");
}
</script>

wynik skryptu

Zapis wartości, zamiana wartości oraz usunięcie wartości w tablicy

<script type="text/javascript">
var kolory = Array();
kolory[0] = "gelb";
kolory[1] = "orange";
kolory[2] = "rot";
document.write("Pierwotna zawartość tablicy: <br />");
for (var indeks in kolory){
    document.write("kolory[" + indeks + "] = " + kolory[indeks] + "<br />");
}

kolory[0] = "blau";
kolory[1] = "hellblau";
kolory[2] = "dunkelblau";
document.write("
Zawartość tablicy po zmianach:<br />");
for (var indeks in kolory){
    document.write("kolory[" + indeks + "] = " + kolory[indeks] + "<br />");
}

kolory[0] = null;
kolory[1] = null;
kolory[2] = null;
document.write("
Zawartość tablicy po zmianach:<br />");
for (var indeks in kolory){
    document.write("kolory[" + indeks + "] = " + kolory[indeks] + "<br />");
}

kolory[0] = "";
kolory[1] = "";
kolory[2] = "";
document.write("
Zawartość tablicy po zmianach:<br />");
for (var indeks in kolory){
    document.write("kolory[" + indeks + "] = " + kolory[indeks] + "<br />");
}
</script>

wynik skryptu

tablica, obiekt, tablica obiektów

tablica

<script type="text/javascript">
var kolory = ["żółty", "pomarańczowy", "czerwony"];
document.write(kolory[0] + "<br />");
document.write(kolory[1] + "<br />");
document.write(kolory[2] + "<br />");
</script>

wynik skryptu

obiekt

<script type="text/javascript">
var kolory = {
      pierwszy: "różowy",
      drugi: "bordowy",
      trzeci: "brązowy",
};
document.write(kolory.pierwszy + "<br />");
document.write(kolory.drugi + "<br />");
document.write(kolory.trzeci + "<br />");
</script>

wynik skryptu

tablica obiektów

<script type="text/javascript">
var kolory = [
      {pierwszy: "żółty", drugi: "pomarańczowy", trzeci: "czerwony"},
      {pierwszy: "różowy", drugi: "bordowy", trzeci: "brązowy"}
]
document.write(kolory[0].pierwszy + "<br />");
document.write(kolory[0].drugi + "<br />");
document.write(kolory[0].trzeci + "<br />");
document.write(kolory[1].pierwszy + "<br />");
document.write(kolory[1].drugi + "<br />");
document.write(kolory[1].trzeci + "<br />");
</script>

wynik skryptu