Co je to funkce ? - Builder.cz - Informacni server o programovani

Rubriky
Odběr fotomagazínu

Fotografický magazín "iZIN IDIF" každý týden ve Vašem e-mailu.
Co nového ve světě fotografie!

 

Zadejte Vaši e-mailovou adresu:

Kamarád fotí rád?

Přihlas ho k odběru fotomagazínu!

 

Zadejte e-mailovou adresu kamaráda:



JavaScript

Co je to funkce ?

2. srpna 2001, 00.00 | Popis práce s funkcemi v javaskriptu. Jak definovat novou funkci, zadat návratovou hodnotu a další.. Vše samozřejmě prezentováno v příkladech.

Funkce je pojmenovaný blok příkazů, který lze z programu zavolat pomocí názvu funkce. Jednoduše řečeno: funkce zastupuje blok příkazů. Funkci tedy použijeme, pokud se nám některé bloky příkazů budou opakovat.

Vytvoření funkce

Funkci vytvoříme velice snadno. Deklarace začíná slovem function a následuje název funkce. Za názvem jsou kulaté závorky do kterých se zapisují parametry (viz. níže). Příkazy se zapisují mezi složené závorky, které následují hned po jednoduchých. Obecný zápis pro funkci pak vypadá takto:

function nazevfunkce()
{
blok obsahujici prikazy
}

Umístění funkce

Protože funkci budete jistě volat z více skriptů bude její umístění nejvhodnější mezi tag <HEAD> </HEAD>. Zajistíme tak, že funkci budeme moc volat ze všech skriptů na stránce. Chcete-li funkci použít pouze v jednom skriptu na stránce, nemusíte ji umisťovat do hlavičky dokumentu, ale lze ji deklarovat přímo ve skriptu:

<SCRIPT LANGUAGE="JavaScript">
nahoda()
{
prikazy
}
nahoda(); // volani funkce
</SCRIPT>

Použití funkce

Následující příkaz vám ukáže jak lze jednoduše s funkcí pracovat. Funkce v tom to případě nejdříve vytvoří náhodné číslo a to pak zobrazí na stránku dokumentu. Funkci voláme pouze jednou a to v jednom jediném skriptu. Pokud by jste chtěli skript volat po načtení stránky musíte použít události. Volání funkce nahoda() po načtení stránky bychom provedli: <BODY onLoad="nahoda();">. K tomu se však ještě vrátíme později. Stránka se skriptem:

<HTML>
<HEAD>
<TITLE>Nahodne cislo</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function nahoda()
{
var rndcislo = null;
rndcislo=Math.round(Math.random()*100);
document.write("<H2> Nahodne cislo: "+rndcislo+"</H2>");
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<H1>Dokonala stranka zobrazujici nahodne cislo</H1>
<SCRIPT LANGUAGE ="JavaScript">
nahoda();
</SCRIPT>
</BODY>
</HTML>

Pozn.: skript si můžete stáhnout na konci stránky. Ten je ještě vylepšen o zobrazení náhodného čísla ve stavovém řádku okna prohlížeče. Přidal jsem také příklad, který volá funkci nahoda() dvakrát.

S řádkem rndcislo=Math.round(Math.random()*100) se zatím nezabývejte. Jen si zatím řekneme, že hodnota 100 určuje maximální hodnotu náhodného čísla.

Funkce s návratovou hodnotou

Náš skript je jistě pěkný, ale nevýhodou je nemožnost změnit jeho výstup, a tak kdykoliv budeme skript volat, vždy se nám náhodné číslo vypíše na dokument. My bychom však chtěli číslo vypsat třeba do titulku okna nebo do stavového řádku prohlížeče. Jistě by bylo možné pro každý případ vytvořit novou funkci, ale to by nebylo zrovna efektivní. Proto potřebujeme, aby funkce nahoda() předala svému okolí hodnotu náhodného čísla. Aby se tak stalo, stačí přidat na její konec příkaz return a za ním hodnotu, kterou po naší funkci požadujeme. V našem případě je to hodnota proměnné rndcislo (my však v příkladu budeme chtít jako návratovou hodnotu text obsahující náhodné číslo, proto vytvoříme textovou proměnnou, viz. příklad). Pak vám nic nebrání vypsat náhodné číslo do stavového řádku prohlížeče, nebo někam jinam. Příklad ukazuje opravenou funkci a její volání:

<SCRIPT LANGUAGE="JavaScript">
function nahoda()
{
var rndcislo = null;
rndcislo=Math.round(Math.random()*100);
var text="Nahodne cislo: "+rndcislo+".";
return text;
}
</SCRIPT>

<SCRIPT LANGUAGE="JavaScript">
document.write(nahoda());
window.status=nahoda();
</SCRIPT>

Pozn.: Pokud skript zkusíte naprogramovat, pravděpodobně se vám zobrazí jiné náhodné číslo ve stavovém řádku a jiné náhodné číslo v dokumentu. To protože je funkce volána pokaždé znovu a tak "vždy" dostaneme jiné číslo.

S funkcemi s návratovou hodnotou lze pracovat podobně jako s proměnnými, nesmíte však zapomenout uvést závorky.

Funkce s parametry

Předchozí funkce mají jednu ohromnou nevýhodu. Nelze je z skriptu ze kterého jsou volány nijak ovlivňovat. A tak jsme se museli spokojit s tím, že vždy nám bude vylosováno číslo od 1 do 100. To napravíme parametrem funkce, pomocí kterého si nastavíme v jakém rozsahu bude číslo losováno. Čím více má funkce parametrů, tím více můžeme její chod externě ovlivnit. Obecný zápis pro funkci s parametry:

function nazevfunkce(par1, par2, par3, par4,...)
{
blok prikazu
}

Náš další příklad ukazuje, jak lze pomocí parametru ovlivnit rozsah losovaných čísel. Budeme potřebovat pouze jeden parametr a to maximální hodnotu náhodného čísla.

<SCRIPT LANGUAGE="JavaScript">
function nahoda(maxhod)
{
var rndcislo = null;
rndcislo=Math.round(Math.random()*maxhod);
var text="Nahodne cislo: "+rndcislo+".";
return text;
}
</SCRIPT>

<SCRIPT LANGUAGE="JavaScript">
document.write(nahoda(100));
window.status=nahoda(10);
</SCRIPT>

Pokud si skript přeložíte, uvidíte, že ve stavovém řádku se bude zobrazovat text s číslem od 1 do 10. V dokumentu se budou zobrazovat čísla od 1 do 100.

Globální a lokální proměnné funkcí

Pokud budete deklarovat proměnnou přímo ve funkci (v našem případě je to proměnná rndcislo), pak tuto proměnnou můžete používat pouze v těle oné funkce. Mimo funkci nelze tuto hodnotu použít. Je to tedy lokální proměnná. Pokud proměnnou deklarujete na začátku skriptu, potom ji lze použít všude ve skriptu, tedy i ve všech funkcí. Takovým proměnným se říká globální. Pokud se ve funkci objeví lokální proměnná, která bude mít stejný název jako globální proměnná, potom lokální proměnná zastíní globální a globální proměnnou nelze ve funkci použít.

Reference

document.title - titulek stránky
podporuje: NN 2.0, IE 3.0

document.bgColor - barva pozadí stránky
podporuje: NN 2.0, IE 3.0

window.status - text ve stavovém řádku
podporuje: NN 2.0, IE 3.0

Download

Ukázky v archivu

Obsah seriálu (více o seriálu):

Tématické zařazení:

 » Rubriky  » JavaScript  

 » Rubriky  » Web  

Poslat článek Diskuse (0) Tisk Přečteno: 3430x

www.builder.cz/rubriky/javascript/co-je-to-funkce--155854cz

 

 

 

Nejčtenější články
Nejlépe hodnocené články
Krátké zprávy

 

Přihlášení k mému účtu

Uživatelské jméno:

Heslo: