× Aktuálně z oboru

Prezentace Embarcadero RAD Studio 10.2 "Tokyo" [ clanek/2017021000-prezentace-embarcadero-rad-studio-10-2-tokyo/ ]
Celá zprávička [ clanek/2017021000-prezentace-embarcadero-rad-studio-10-2-tokyo/ ]

JavaScript - 5. lekce

[ http://programujte.com/profil/1100-tomas-bobek/ ]Google [ ?rel=author ]       [ http://programujte.com/profil/75-martin-zak/ ]Google [ :?rel=author ]       8. 2. 2006       25 593×

  • Pole a vše kolem něj
  • Vlastnosti polí
  • Dialogová okna

Pole v JavaScriptu

Pole je skupina "proměnných" v jednom prvku, kde jsou jednotlivé "proměnné" číslovány od nuly. Lépe to pochopíte na příkladech.

Deklarace pole (do hlavičky):


<script language="JavaScript" type="text/javascript">
 pole1 = new Array("prvek č.0", "prvek č.1", "prvek č.2", "prvek č.3"); //první způsob deklarace
 pole2 = ["prvek č.0", "prvek č.1", "prvek č.2", "prvek č.3"]; //druhý způsob deklarace
</script>

Zápis pole do dokumentu:


<script language="JavaScript" type="text/javascript">
 document.write(pole1[0]+ ", " +pole1[3]+ ", " +pole2[1]);
</script>

Měli bychom se dopídit k výsledku:


prvek č.0, prvek č.3, prvek č.1

Vysvětlení:

  • new Array - deklaruje prvky pole, pouze pokud jsou v kulaté závorce
  • pole1 - název pole (je libovolný, třeba i číslo)
  • (pole1[0]) - pole1 značí, že budeme čerpat z pole s názvem pole1 a číslo v hranaté závorce nám značí číslo prvku (začíná se od 0)
  • znaménka + a vkládání mezer snad nemusím vysvětlovat

Slučování polí

Ke slučování dvou polí do jednoho budeme používat metodu concat(). Ukážeme si jeden příklad slučování polí.

Do hlavičky píšeme:


<script language="JavaScript" type="text/javascript">
 pole1 = ["a", "b", "c"];
 pole2 = ["d", "e", "f"];
 pole3 = pole1.concat(pole2);
</script>

Chceme-li zapsat 'e', napíšeme do těla dokumentu


<script language="JavaScript" type="text/javascript">
 document.write(pole2[1]); //zápis 'e' z druhého pole
 document.write(pole3[4]); //zápis 'e' ze třetího pole
</script>

Přidávání prvků do polí

Tady si ukážeme, jak přidat další prvky do jednoho pole, aniž bychom toto pole museli přepisovat. Ukážeme si tři způsoby - jak umístit prvek kamkoli do pole, jak umístit prvek na konec pole, jak umístit prvek na začátek pole (budu psát pouze zápis do hlavičky souboru).

Umístění s libovolným pořadím:


<script language="JavaScript" type="text/javascript">
 pole = ["prvek0", "prvek1", "prvek2"];
 pole[3] = "prvek3"; //do pole jsme přidali třetí prvek s poř. číslem 3
</script>

Umístění na konec pole:


<script language="JavaScript" type="text/javascript">
 pole = ["prvek0", "prvek1", "prvek2"];
 pole.push("prvek3", "prvek4"); // na konec pole jsme přidali další dva prvky
</script>

Umístění na začátek pole:


<script language="JavaScript" type="text/javascript">
 pole = ["prvek1", "prvek2", "prvek3"];
 pole.unshift("prvek0"); //na začátek pole jsme přidali jeden prvek
</script>

Úkol č.1

Do hlavičky souboru napište pole se třemi prvky - pomeranč, cukr, petržel. Do těla souboru pak text: Musím koupit cukr, petržel a pomeranč. (cukr, petržel a pomeranč musí pochopitelně být prvky pole)

Vlastnosti pole

Metoda Vlastnost
concat(...) spojí daná pole
join(oddělovač) spojí daná pole, která oddělí oddělovačem
push(...) přidá prvky na konec pole
upshift(...) přidá prvky na začátek pole
pop() odstraní poslední prvek pole a vrátí ho
reverse() obrátí pořadí prvků v poli
slice(od, do) vrátí prvky od do...
sort() seřadí prvky v poli
tostring() vrátí všechny prvky oddělené čárkou
shift() odstraní první prvek v poli

Dialogová okna

Pomocí dialogových oken vás může script upozorňovat, dávat vám na výběr, zkrátka můžete se scriptem komunikovat. Ukážeme si dva příklady se jménem autora článku a jeden se změnou barvy písma.

První příklad:


<input type="button" onclick="alert('Jméno autora')" value="Autor">

Výsledek:

Druhý příklad (s dotazem):


<head>
<script language="JavaScript" type="text/javascript">
 function dotaz(){
  okno = confirm("Chcete znát jméno autora tohoto článku?");
  if(okno) alert("Jmeno autora");
 }
</script>
</head>
<body>
<input type="button" onclick="dotaz();" value="Autor">
</body>

Výsledek:

Co ještě neznáme:

  • confirm - vyvolá dotazník s možnostmi ano nebo ne
  • if - vyvolá něco pouze pokud byly spněny podmínky předešlé události (u nás se vyvolá alert, pokud jste v dotazníku stiskli ano)
  • (okno) - je hodnota příkazu if

Úkol č.2

Udělejte stránku, kde bude obyčejný text. Když na něj kliknu, objeví se mi dotaz, zda-li chci vidět věk autora. Po stisknutí 'ano' se věk autora ukáže.


Článek stažen z webu Programujte.com [ http://programujte.com/clanek/2006011701-javascript-5-lekce/ ].