#1 Funkce
Funkce je blok kódu, který je určen, aby vykonal nějakou určitou úlohu, když je daná funkce odkudkoliv zavolána. Ve funkci se nachází normální kód, ale samotná funkce usnadňuje potřebu daný kód kopírovat – ve funkci je jednou napsán a pokaždé ho jenom voláme.
Funkce mohou také přijímat parametry (argumenty), které je potřeba při zpracování kódu a mohou je také vracet.
Následující funkce se jménem vynasob() vynásobí první argument druhým a vrátí výsledek.
function vynasob(a, b) {
return a * b;
}
let vysledek = secti(3, 7);
console.log(vysledek);
// Vypíše 21
#2 Složení a syntaxe funkce
Každá funkce vychází ze základu function jmeno(arg) {} – musí obsahovat klíčové slovo function, které definuje, že se jedná o funkci, jméno, po kterém následují kulaté závorky (), do kterých se mohou, ale nemusí definovat parametry (jeden nebo vícero) a tělo funkce, které je obaleno v složených závorkách {}.
function jmeno(arg) {
// Tělo funkce
}
Název funkce
Podobně jako proměnné, i názvy funkcí musí být jedinečné a nemohou se opakovat. Měly by být psány pomocí camelCase (co je camelCase vysvětlujeme v článku Syntaxe JavaScriptu)
Parametry
Umisťují se do kulatých závorek a slouží k předání hodnot (string, číslo, výsledek jiné funkce apod.) z prostoru mimo funkci do dané funkce. Může jich být několik, jeden nebo také daná funkce parametry nepotřebuje a neuvádíme žádný (závorky však stále zůstávají).
// Příklady
function secti(a, b) {}
function porovnej(x, y, z) {}
function zobrazUpozorneni() {}
#3 Volání funkce
Blok kódu, jímž je funkce, bude spuštěn pouze tehdy, zavolá-li „něco“ tuto funkci. Tímto voláním může být:
- při manuálním zavolání funkce,
- při akci vyvolané uživatelem,
- automatické zavolání.
Manuální zavolání
Volání funkce „manuálně“ znamená, že funkce je vyžádána nějakým kódem. Jedná se o klasickou verzi zavolání.
function secti(a, b) {
return a + b;
}
// Volání funkce do proměnné x
const x = secti(3, 2);
Akce vyvolaná uživatelem
U akce vyvolané uživatelem se provede funkce tehdy, když uživatel udělá nějakou akci. Touto akcí může být například kliknutí myší, scrolování na webu apod. Využívá se k tomu posluchač události addEventListener o kterém se dozvíte více v jiném článku.
function zobrazUpozorneni() {
alert("Zde nelze klikat!");
}
window.addEventListener('click', zobrazUpozorneni);
Automatické zavolání
Automatické zavolání znamená, že se funkce vykoná okamžitě po načtení, tj. není ji potřeba nijak volat. Toto lze provést několika způsoby, avšak dva jsou nejčastější – pomocí posluchače události, který čeká na načtení stránky anebo pomocí speciální syntaxe.
// Pomocí posluchače
document.addEventListener('DOMContentLoaded', function jmeno() {
// Tělo funkce
});
// Pomocí speciální syntaxe
(function jmeno() {
// Tělo funkce
})();
#4 Klíčové slov return
Klíčové slovo return slouží k návratu hodnoty z funkce. Pokud je ve funkci použit return, funkce vrátí hodnotu specifikovanou za tímto klíčovým slovem a zároveň ukončí své vykonávání.
function secti(a, b) {
let vysledek = a + b;
return vysledek;
// Vracení proměnné
}
// Volání funkce do proměnné x
const x = secti(3, 2);