Funkcje w JavaScript

Funkcje, to w JavaScript, a także innych językach programowania, bardzo wygodny sposób na wielokrotne wykorzystanie tego samego kodu i to w sposób sparametryzowany. Poniższy film ilustruje klasyczne pojęcie funkcji w języku programowania.

Deklaracja funkcji jest prosta. Ma następującą postać (parametry są opcjonalne):

W przypadku, gdy chcemy zwrócić jakąś wartość funkcji, stosujemy słowo kluczowe return i nazwę zmiennej, która zawiera tę wartość. Konstrukcja takiej funkcji jest następująca:

Przykłady stosowania funkcji

Oto kilka przykładów stosowania funkcji w JavaScript.

Przykład 1 - funkcja bez parametrów i słowa kluczowego return.

Przykład ten ilustruje najprostsze wykorzystanie funkcji. Funkcja ma za zadanie wyświetlić okno alertu z informacją, że wywołano właśnie funkcję.

<script>
function alarmuj() {
   alert("To okienko zostało wywołane z wnętrza funkcji");
}
alarmuj();
</script>

Przykład 2 - wykorzystanie parametru przekazywanego do funkcji.

Przykład ten ilustruje sposób przekazywania parametrów do funkcji. Funkcja ma za zadanie wyświetlić okno alertu z informacją, którą programista wpisze jako parametr wywołania funkcji.

<script>
function alarmuj(komunikat) {
   alert(komunikat);
}

alarmuj("Komunikat 1: Okienko jest wywoływane z wnętrza funkcji, ale tekst komunikatu przekazywany jest z zewnątrz funkcji.");
alarmuj("Komunikat 2: to kolejne okienko wywołane z tej samej funkcji, ale z innym komunikatem!");
</script>

Przykład 3 - Prosty kalkulator podatku VAT.

Przykład ten ilustruje sposób przekazywania parametru liczbowego do funkcji. Funkcja oblicza wartość podatku VAT od ceny netto, przekazywanej jako argument funkcji i wyświetla go w okienku alarmu.

<script>
function VAT(cena_netto) {
   alert("Podatek VAT od ceny netto "+cena_netto+ " zł wynosi "+ cena_netto *0.23+" zł.");}

VAT(200);
VAT(100);
</script>

Przykład 4 - Przykład funkcji zwracającej wartość logiczną.

Funkcja ma za zadanie sprawdzenie, czy dana liczba (przekazany parametr) jest parzysta, czy nieparzysta. Jeżeli jest parzysta, to funkcja zwraca wartość true, w przeciwnym przypadku zwraca wartość false; Program główny, w zależności od tego, jaki uzyska wynik zwrotny od funkcji, wyświetla odpowiedni komunikat. Dodam tylko, że skorzystamy tutaj z własności liczb parzystych, dla których reszta z dzielenia jest równa zero (dla każdej liczby parzystej).

<script>
function czyParzysta(liczba) {
 if (liczba % 2 == 0) {
   return true;
 } else {
   return false;
 } 
}
var n = 23543256;
if (czyParzysta(n) == true) {
   alert("Liczba " + n + " jest parzysta");
} else {
   alert("Liczba " + n + " jest nieparzysta");
}
</script>

Funkcja anonimowa

Funkcję możemy definiować także jako anonimową (jako wyrażenie). Oto sposób deklaracji takiej funkcji.

Funkcja zdefiniowana za pomocą deklaracji (pierwszy sposób) jest od razu dostępna dla całego skryptu. Funkcja stworzona za pomocą wyrażenia jest dostępna po przetworzeniu skryptu. Funkcje te wykorzystuje się na przykład przy obsłudze zdarzeń, o których będzie mowa później. Funkcja anonimowa może być wykorzystana jako argument innej funkcji!

Samowywołująca się funkcja

Wiemy już, że nie musimy w ogóle podawać nazwy funkcji. Funkcje takie stosujemy dlatego, że zmienne i metody tam deklarowane są lokalne i dzięki temu wzorzec takiej funkcji nie jest dostępny dla zewnętrznego środowiska. Dodam, ze taka funkcja wywołuje sie od razu.

Przykład 5 - Przykład samowywołującej się funkcji z przykładu 4.

Poniżej podaję przykład samowywołującej sie funkcji z parametrem, podobny do przykładu 4. (Ten przykład ma na celu pokazanie jedynie składni, większe zastosowanie tego typu funkcji omówię przy okazji opisywania modułów). Uwaga! Funkcja wykonuje się automatycznie, więc komunikat wyskoczy od razu.

<script>
(function czyParzysta1(liczba) {
 if (liczba % 2 == 0) {
   alert("Liczba " + liczba + " jest parzysta");
 } else {
   alert("Liczba " + liczba + " jest nieparzysta");
 } 
})(234);
</script>

Zasięg zmiennych

Jeżeli zmienną zadeklarujemy w samej funkcji, zmienna ta będzie widoczna tylko w tej funkcji. Jest to zmienna lokalna.

Zmienna zadeklarowana poza funkcją może być wykorzystana zarówno poza funkcją jak i w samej funkcji. Zmienna taka jest zmienną globalną.

Przykład 6 - zmienne lokalne i globalne.

Przykład ilustruje widoczność zmiennych w kodzie programu JavaScript.

<script>
var y = 1; // TO JEST ZMIENNA GLOBALNA, Można z niej korzystać w całym skrypcie.
function mojaFunkcja() {
var y = 1 // TO JEST ZMIENNA LOKALNA, widoczna tylko wewnątrz funkcji.
}
var y = 1; // TO TEŻ JEST ZMIENNA GLOBALNA
mojaFunkcja();
</script>

Inne zagadnienia z tej lekcji

© medianauka.pl, 2016-11-01, A-3263
Data aktualizacji artykułu: 2024-06-26