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):

function nazwaFunkcji(parametr1, parametr2, ...) {
... kod funkcji ...
}

nazwaFunkcji(argument1, argument2, ...) // tutaj następuje wywołanie funkcji

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:

function nazwaFunkcji(parametr1, parametr2, ...) {
... kod funkcji ...
return zmienna;
}

var zmienna_1 = nazwaFunkcji(argument1, argument2, ...)
// tutaj następuje wywołanie funkcji i przypisanie wartości funkcji do zmiennej_1

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>

Lupa


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>

Lupa


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>

Lupa


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>

Lupa


Funkcja anonimowa

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

var zmienna = function(parametr1, parametr2, ...) {
... kod funkcji ...
}

zmienna(argument1, argument2, ...); // tutaj następuje wywołanie 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.

(function() {...})();

lub

(function(parametr1, parametr2, ...) {
... kod funkcji ... })(argument1, argument2, ...);

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>
Pobierz


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

Instrukcje warunkowe w JavaScript


instrukcje warunkowe w JavaScript. JavaScript udostępnia kilka instrukcji warunkowych, czyli takich, które w zależności od wartości wyrażenia sterują przebiegiem programu.

Pętle w JavaScript


Pętle for, while, do ... while w JavaScript. Pętle to specjalny fragment kodu, który odpowiada za powtarzanie poleceń zawartych wewnątrz pętli taką ilość razy, jaka w pętli zostanie zdefiniowana poprzez odpowiednie warunki.

Tablice w JavaScript


Tablice w JavaScript - opis stosowania tablic i ich metod. Tablice w JavaScript, to specjalny typ danych, który pozwala w jednej zmiennej przechowywać wiele wartości.

Math - JavaScript


Opis obiektu Math w JavaScript. Dzięki niemu możemy w JavaScript odwoływać się do stałych matematycznych i dokonywać obliczeń. Wykaz metod, które służą do obliczania wartości funkcji matematycznych.

Random w JavaScript


liczby losowe w JavaScript - opis metody random(). Za generowanie liczb losowych odpowiada metoda Random obiektu Math. Metoda ta generuje losowo liczbę z zakresu od 0 (włącznie) do 1 (bez jedynki).

Okna dialogowe w JavaScript


Rodzaje i stosowanie okienek dialogowych w Javascript. W JavaScript mamy do wyboru trzy rodzaje okienek dialogowych, wyzwalanych przez metody alert(), confirm() i prompt().

String - tekst w JavaScript


Opis obiektu String w JavaScript. Dzięki temu obiektowi możemy w JavaScript przechowywać i przetwarzać wszelkie teksty. Znaki w tekście są indeksowane od liczby 0.

Wyrażenia regularne


Wyrażenia regularne w JavaScript. Wyrażenie regularne to szablon tekstowy, wzorzec, który opisuje pewien zestaw znaków. Artykuł zawiera wykaz metaznaków wraz z przykładami ich stosowania.

Obiekt date() - data i czas w JavaScript


Obsługa dat i czasu w JavaScript. W JavaScript mamy do dyspozycji obiekt date(), który daje nam możliwość dostępu do dat i manipulowania datami oraz czasem.




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



Udostępnij
©® Media Nauka 2008-2023 r.