Kihagyás

Függvények

Függvénydefiníció

JavaScriptben a function kulcsszóval definiálhatunk saját függvényeket. Ezt követően megadjuk a függvény nevét, majd zárójelek között a bementi paramétereket (ha vannak). A függvény törzsét kapcsos zárójelpár között adhatjuk meg. A függvényeinknek természetesen lehet visszatérési értéke is, ezt a return kulcsszó után adhatjuk meg.

A függvénydefiníció általános szintaxisa (a szögletes zárójelek közötti részek elhagyhatók):

1
2
3
4
function fuggvenyNeve([param1, param2, ...]) {
    // utasítások...
    [return visszateresi_ertek;]
}

Érdemes megjegyezni, hogy a függvényen belül létrehozott változók függetlenül attól, hogy a var vagy let kulcsszóval deklaráljuk őket, minden esetben lokálisak lesznek a függvény törzsén belül. Ha a függvényen kívül akarunk rájuk hivatkozni, akkor hibát kapunk.

1
2
3
4
5
6
7
function egyKlasszFuggveny() {
    var valamiValtozo = 10;
    let valamiMasikValtozo = 20;
}

// console.log(valamiValtozo);              // HIBA!!
// console.log(valamiMasikValtozo);         // SZINTÉN HIBA!!

Függvényhívás

Ha egy függvényt meg szeretnénk hívni JavaScriptben, akkor azt a szokásos szintaxissal tehetjük meg (a szögletes zárójelek közötti részek elhagyhatók):

1
fuggvenyNeve([param1, param2, ...]);

A hívás során átadjuk a függvénynek a bemeneti paramétereket (feltéve ha a kérdéses függvény vár paramétert).

Ha a függvényhívás során nem adjuk meg valamelyik függvényparaméter értékét, akkor az adott paraméter az undefined speciális értéket veszi fel.

1
2
3
4
5
function info(nev, eletkor) {
    console.log(nev + " " + eletkor + " éves.");
}

info("Józsi");          // eletkor értéke: undefined

Kimenet

Józsi undefined éves.

Érdekes módon, ha több paraméterrel hívunk meg egy függvényt, mint amennyi paramétert vár, akkor a JavaScript erre nem dob hibát. Ekkor a "fölösleges" paraméterek nemes egyszerűséggel figyelmen kívül lesznek hagyva.

1
2
3
4
5
function osszead(szam1, szam2) {
    return szam1 + szam2;
}

console.log(osszead(10, 20, 30, 40));   // a 30 és 40 paramétereket figyelmen kívül hagyjuk

Kimenet

30

Paraméterek meglétének ellenőrzése

Amint fentebb láthattuk, JavaScriptben gond nélkül megtehetjük azt, hogy a függvény egy adott paraméterének nem adunk át értéket a függvényhíváskor. Ez nem túl előnyös, jó lenne, ha ezt valahogyan le tudnánk kezelni.

Ha egy paraméter értékét nem adtuk meg, akkor az adott paraméter az undefined speciális értéket veszi fel. Ezt kihasználva már könnyedén le tudjuk ellenőrizni, hogy egy paraméter értékét megadták-e.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
function koszon(nev) {
    if (nev === undefined) {        // ha a nev paramétert nem adták meg...
        console.log("Add meg annak a nevét, akinek köszönni szeretnél!");
    } else {
        console.log("Szia " + nev + "!");
    }
}

koszon();
koszon("János");

Kimenet

Add meg annak a nevét, akinek köszönni szeretnél! Szia János!

Default paraméterek

A Pythonban tanultakhoz hasonlóan JavaScriptben sincs function overload (még eltérő paraméterezés esetén sem). Ha két vagy több azonos nevű függvényünk van, akkor mindig a kódban legkésőbb definiált függvény lesz hívható.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
function hello() {
    console.log("Hello!");
}

function hello(nev) {   // ezt fogjuk tudni meghívni
    console.log("Hello " + nev + "!");
}

hello();
hello("János");

Kimenet

Hello undefined! Hello János!

A fenti kódban két hello névre hallgató függvényünk is van, ezért a fentebb leírtak miatt a legutoljára definiált, egy paramétert váró hello(nev) függvény lesz hívható. Mivel a 9. sorban nem adtuk meg a nev paraméter értékét, ezért az az undefined értéket vette fel.

Szerencsére a Pythonból ismerős default függvényparaméterek JavaScriptben is léteznek. Ezek segítségével már el tudjuk érni, hogy egy függvényt többféle eltérő paraméterezés mellett is használhassunk.

Emlékeztetőül: a default paraméterek lényege, hogy a függvény bizonyos paramétereinek alapértelmezett értéket adunk a függvénydefiníció során. Ha a függvényhíváskor nem adjuk meg az adott paraméter értékét, akkor az az alapértelmezett értéket veszi fel.

1
2
3
4
5
6
function hello(nev="Senki") {
    console.log("Hello " + nev + "!");
}

hello();                // nev értéke: "Senki"
hello("János");         // nev értéke: "János"

Kimenet

Hello Senki! Hello János!

Mivel a függvényhíváskor a paraméterek átadása JavaScriptben is "balról jobbra" történik, ezért itt is fontos, hogy ha nem minden paraméternek adunk default értéket, akkor a default értékkel rendelkező paraméterek mindig a paraméterlista jobb oldalán szerepeljenek (azaz mindig az utolsó néhány paraméternek kell default értéket adnunk).

1
2
3
4
5
6
7
function info(nev, eletkor=20, foglalkozas="programozó") {
    console.log(nev + " " + eletkor + " éves és " + foglalkozas + ".");
}

info("Józsi");
info("Józsi", 50);
info("Józsi", 50, "asztronauta");

Kimenet

Józsi 20 éves és programozó. Józsi 50 éves és programozó. Józsi 50 éves és asztronauta.

Callback függvények

JavaScriptben gyakran előfordul, hogy egy függvényt egy másik függvény paramétereként használunk fel. Az ilyen függvényt nevezzük callback függvénynek.

A callback függvényt természetesen meg is tudjuk hívni abban a függvényben, amely paraméterül kapja azt. Ezt a meghívást feltételhez is köthetjük, ha szeretnénk.

Példa: Az ejszakaNeZenelj függvény második paramétereként átadott zenetJatszik függvény egy callback függvény, amit a 13. sorban meghívunk

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
// ő lesz majd a callback függvényünk, amit meghívunk egy másik függvényben

function zenetJatszik() {
    console.log("Hadd szóljon a Rock and Roll!");
}

// egy függvény, amelynek a callback nevű paramétere szintén egy függvény lesz

function ejszakaNeZenelj(ora, callback) {
    if (ora >= 22 || ora <= 6) {
        console.log("Éjszaka van, alszanak a szomszédok!");
    } else {
        callback();     // callback függvény meghívása
    }
}

// függvényhívás: a callback függvény a zenetJatszik függvény lesz

ejszakaNeZenelj(16, zenetJatszik);

Kimenet

Hadd szóljon a Rock and Roll!

JavaScriptben érdemes lehet leellenőrizni, hogy a callback függvényünk ténylegesen egy függvény-e. Ezt a typeof kulcsszóval tudjuk egyszerűen megtenni.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
function myCallback(param) {
    console.log("Callback függvény meghívva " + param + " paraméterrel.");
}

function myFunction(callback) {
    if (typeof callback === "function") {   // típusellenőrzés...
        callback("kiscica");
    }
}

myFunction(myCallback);

Kimenet

Callback függvény meghívva kiscica paraméterrel.

JavaScript függvények egyéb megadási módjai

Anonim függvények

JavaScriptben a hagyományos függvénydefiniálás mellett a függvényeket egy kifejezésként is definiálhatjuk. Ezeket a függvény kifejezéseket akár egy változóban is eltárolhatjuk.

1
let osszead = function (a, b) { return a + b; }

Miután a példában a függvény kifejezésünket eltároltuk az osszead változóban, a változót használhatjuk függvényként.

1
2
3
let osszead = function (a, b) { return a + b; }
let osszeg = osszead(10, 5);        // függvényhívás
console.log(osszeg);

Kimenet

15

Az ilyen módon létrehozott függvényeket anonim függvénynek is nevezik, hiszen ezek nem rendelkeznek függvénynévvel. Nincs is szükség rá, hogy névvel rendelkezzenek, hiszen az őket tároló változó nevével tudjuk őket meghívni.

Egy fontos különbség a hagyományos úton definiált függvények és az anonim függvények között, hogy az anonim függvények csak akkor jönnek létre, amikor a vezérlés eljut hozzájuk, és csupán ekkortól lesznek használhatóak. Ezzel szemben a hagyományos módon definiált függvények már a definiálásuk előtt is elérhetők, hívhatók a kódban.

1
2
3
4
5
6
7
8
hello1();       // a hello1 függvény már a definíciója előtt is hívható

function hello1() {
    console.log("Hello World!");
}

// hello2();    // HIBA!! - itt a hello2 anonim függvény még nem jött létre
let hello2 = function() { console.log("Hello World!"); }

Kimenet

Hello World!

Arrow function-ök

Az ECMAScript 6 (ES6) szabványban bevezették az úgynevezett arrow function-öket az anonim függvények tömörebb megadására.

A szintaxisuk a következő:

1
let myArrowFunction = (/* param1, param2, ... */) => { /* ... */ };

Ha a függvényünk nem vár egyetlen paramétert sem, akkor a => előtti zárójelpárt üresen hagyjuk. Ha a függvényünk egyetlen paramétert vár, akkor a zárójeleket el szoktuk hagyni.

Példa: 0, 1 és 2 paramétert váró arrow function-ök

1
2
3
4
5
6
7
let koszon = () => { console.log("Hello World!"); }
let kedvencFagyi = iz => { console.log("A kedvenc fagyiízünk: " + iz); }
let osszead = (a, b) => { return a + b; }

koszon();
kedvencFagyi("csokoládé");
console.log(osszead(10, 5));

Kimenet

Hello World! A kedvenc fagyiízünk: csokoládé 15


Utolsó frissítés: 2021-11-18 14:51:01