Džavascript - online verze
obsah1. díl2. díl 3. díl4. díl5. díl6. díl7. díl8. díl
II.
Začíname s funkciami...

     Pri tvorbe skriptov sa často dostávame do situácie, kedy potrebujeme zopakovať určitú súslednosť už raz vykonaných príkazov. Vtedy je výhodné si zadeklarovať funkciu, ktorá by obsahovala tieto príkazy. Takúto funkciu môžeme potom v prípade potreby kedykoľvek vyvolať z ľubovolnej časti programu. Využívanie funkcií šetrí veľkosť zdrojového textu a naviac sa skript takto stáva prehľadnejším.


     Príklad 2.1: Jednoduchá funkcia - čiara

     Funkcie sa zvyknú deklarovať na začiatku stránky medzi párovým tagom <HEAD> a </HEAD>.

   
<html>
<head>
<title>Jednoducha funkcia</title>
<script language="JavaScript">
<!--
  function ciara()
  {
    document.write("===============================<br>"); 
  }
// -->
</script>
</head>
<body>
<script language="JavaScript">
<!--
  ciara();
  document.write("Programujeme v JavaScripte<br>"); 
  ciara();
// -->	
</script>
</body>
</html>
  

     Toto bol jednoduchý príklad funkcie, ktorá po vyvolaní, nakreslila čiaru. Funkcie však môžu byť aj podstatne zložitejšie, tzn. že môžu spracovávať aj nejaké vstupné údaje (parametre) a na ich základe vykonávať už mierne odlišný sled príkazov. Tým sa z nich stávajú viacúčelové stavebné prvky.
     V nasledujúcom príklade si ukážeme akým spôsobom je možné vyvolať funkciu s parametrom a ako funkcia dokáže vrátiť hodnotu na miesto odkiaľ bola vyvolaná.


     Príklad 2.2: Ukážka zložitejších funkcií

     

     Pri deklarácii funkcie, ktorá má obsahovať vstupné parametre, sa miesto prázdnych zátvoriek zapisuje zoznam parametrov oddelených od seba čiarkou. Pri vyvolaní tejto funkcie musíme tieto parametre uviesť.
     Funkcia vypis pozostáva z 3 parametrov: farba, veľkost a text. Parametre farba a veľkosť udávajú formát textu a parameter text obsahuje text, ktorý sa má vypísať.
     Funkcia nahodne_cislo pozostáva z parametru rozsah, ktorý udáva v akom rozsahu má byť vygenerované náhodné číslo.

   
<html>
<head>
<title>Ukazka zlozitejsich funkcii</title>
<script language="JavaScript">
<!--
  function vypis(farba,velkost,text)
  {
    t1="<font ";
    t2="color="+farba+" ";
    t3="size="+velkost+">";
    t4="</font>";
    document.write(t1+t2+t3+text+t4);
  }
  function nahodne_cislo(rozsah)
  {
    return Math.round(Math.random()*rozsah);
  }
// -->
</script>
</head>
<body>
<script language="JavaScript">
<!--
  rozsah=100;
  vypis("green",4,"nahodne cislo ");
  vypis("black",2,"do "+rozsah+" je: ");
  vypis("red",5,nahodne_cislo(rozsah));
// -->
</script>
</body>
</html>

     V uvedenom príklade sa okrem už spomenutých 2 funkcií vyskytujú aj matematické funkcie: Math.round() a Math.random(). Funkcia Math.round() zaokrúhľuje čísla na 0 desatinných miest a funkcia Math.random() generuje náhodné čísla v udanom rozsahu. Prehľad ostatných matematických funkcií je uvedený v prílohe.
     Vo funkcii nahodne_cislo sa nachádza pre nás zatiaľ ešte neznámy príkaz return. Ten spôsobuje vrátenie udanej hodnoty na miesto v skripte odkiaľ bola funkcia volaná. V našom prípade dôjde k odovzdaniu vygenerovaného náhodného čísla do funkcie vypis, ktorá ho následne spracuje (vypíše ho na obrazovku červenou farbou).

Hádam, hádaš, hádame alebo načo robiť for-y...

     Na záver si naprogramujeme jednoduchú hru Hádanie čísel. V tejto hre má hráč za úlohu uhádnuť číslo, na ktoré myslí počítač (od 1 do 100). Aby to mal ľahšie, počítač mu bude radiť v štýle hádaj menej/hádaj viac. Hra sa úspešne končí ak hráč uhádne hľadané číslo do 10. pokusov.


     Príklad 2.3: Hádanie čísel

     Okrem už známych konštrukcií if..else sa v tomto skripte nachádza aj príkaz cyklu: for. Jeho funkciou je zabezpečovať cyklické vykonávanie príkazov, ktoré sa nachádzajú vo vnútri jeho hranatých zátvoriek. Príkazy sú vykonávané dovtedy, kým je splnená podmienka udaná pri jeho deklarácii.

     Syntax príkazu je následovná:

for (začiatok;koniec;operácia)
{
...
}

začiatok - počiatočná hodnota danej premennej
koniec - konečná hodnota danej premennej zapísaná vo forme výrazu (ak výraz platí, cyklus beží)
operácia - udáva, že ako sa má daná premenná zmeniť po každom vykonaní cyklu

     V našom prípade cyklus for pracuje následovne. Do premennej pokus sa vloží číslo 2. Keďže je to číslo menšie ako 11, vykonajú sa príkazy vo vnútri hranatých zátvoriek. Po ich vykonaní sa hodnota premennej pokus zvýši o 1 (pokus++, viď príloha). Teraz premenná pokus obsahuje číslo 3. Podmienka je opäť splnená (pokus je menší ako 11), a preto sa opäť vykonajú príkazy vo vnútri for. Celé sa to opakuje dovtedy, kým hráč neuhádne dané číslo alebo mu neuplynie desiaty pokus (cyklus for už ďalej nebude pokračovať, pretože prestáva platiť podmienka pokus<11).

   
<html>
<head>
<title>Hra: Hadanie cisel</title>
<script language="JavaScript">
<!--
  function hadanie_cisel()
  {
    oznam1="Hra: Hadanie cisel\n\n";
    oznam2="Cielom hry je uhadnut cislo na 10 pokusov\n";
    oznam3="Pocitac vam bude radit (menej/viac)\n\n";
    oznam4="Vela stastia!";
    window.alert(oznam1+oznam2+oznam3+oznam4);
    vymyslene=Math.round(Math.random()*100);
    hadane=window.prompt("Hadaj cislo do 100 (1.pokus)","0");
    for (pokus=2; pokus<11; pokus++)
    {
      if (vymyslene==hadane)
      {
        window.alert("Vyhral si na "+(pokus-1)+".pokus");
        return;
      }
      if (vymyslene<=hadane)
        hadane=window.prompt("Hadaj menej! (pokus "+pokus+".)",hadane);
      else
        hadane=window.prompt("Hadaj viac! (pokus "+pokus+".)",hadane);
      if (pokus==10) window.alert("Prehral si!");
      }
    }
// -->
</script>
</head>
<body>
<script language="JavaScript">
<!--
  hadanie_cisel();
// -->
</script>
</body>
</html>

Záverom...

     A máme tu koniec 2. časti seriálu o programovaní v JavaScripte. Dúfam, že ste aj túto časť zvládli v pohode a že ste sa nestretli s nejakými nejasnosťami. Ak si predsa neviete dať s niečim rady, kľudne mi pošlite e-mail a ja sa vám pokúsim zodpovedať na vaše otázky. Na budúce si rozoberieme problematiku prezentačných okien...

     Veľa úspechov s JavaScriptom vám želá,

Rastislav Škultéty
webmaster@javascript.sk

PRÍLOHA: Matematické funkcie a aritmetické operátory

Funkcia (Math.nazov)

abs
sin, cos, tan
asin, acos, atan
exp
log
ceil
floor
min, max
pow
round
sqrt

  

Popis funkcie

absolútna hodnota
štandartné trigonometrické funkcie (argument v radiánoch)
inverzné trigonometrické funkcie (vracajú hodnotu v radiánoch)
exponenciálna funkcia (základ e)
prirodzený logaritmus (základ e)
zaokrúhľovanie smerom hore
zaokrúhľovanie smerom dole
argument obsahuje 2 čísla, funkcia vráti to číslo, ktoré je menšie/väčšie
exponenciálna funkcia (prvý argument je základ, druhý exponent)
všeobecné zaokrúhľovanie
odmocnina


Symbol

pokus++
pokus--
pokus+=x
pokus-=x
pokus*=x
pokus/=x

   Popis

pripočíta k premennej pokus číslo 1
odpočíta z premennej pokus číslo 1
pripočíta k premennej pokus číslo x
odpočíta z premennej pokus číslo x
vynásobí pôvodný obsah premennej číslom x
vydelí pôvodný obsah premennej číslom x

   To isté ako

pokus=pokus+1 (pokus+=1)
pokus=pokus-1 (pokus-=1)
pokus=pokus+x
pokus=pokus-x
pokus=pokus*x
pokus=pokus/x


NAHORU
grafické zpracování (C) 1999 Jakub Holý, časopis Internet, Trade & Leisure Publications Praha
obsah, online zpracování (C) 1998 - 1999 Rastislav Škultéty