chevron-left chevron-right

[JS] Kilka słów o parametrach w funkcjach JavaScript

Dzisiejszy wpis będzie poświęcony temu jak funkcje Javascript obsługują parametry, które są do nich przekazywane. Jest to przydatna wiedza, a na pewno dla bardziej zaawansowanych programistów będzie to wiedza już znana.

Jak wiadomo, funkcje w każdym języku programowanie mogą przyjmować parametry. W języku Javascript ich obsługa się nieco różnić od sposobów ich przekazywania w takich językach jak C++ czy C#.

Przekazywanie parametrów do funkcji

Do funkcji możemy przekazać tyle parametrów ile chcemy, niezależnie od tego ile jest przez nich obsługiwanych. Jeśli wymagane parametry nie zostaną przekazane, to funkcja będzie zwracać wartość undefined dla potrzebnego parametru. W ten sposób można łatwo zakłócić pracę funkcji a przez to całej aplikacji JS, jeśli programista nie pomyślał o obsłudze błędnej ilości parametrów.

Załóżmy, że funkcja z parametrami wygląda następująco:

1
2
3
4
var jakasFunkcja = function (param1, param2) {
  console.log('Parametr 1:', param1);
  console.log('Parametr 2:', param2);
}

Tak zdefiniowaną funckję możemy wywołać na kilka sposobów:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
jakasFunkcja();
// Parametr 1: undefined
// Parametr 2: undefined
 
jakasFunkcja(1);
// Parametr 1: 
// Parametr 2: undefined
 
jakasFunkcja(1, 2);
// Parametr 1: 1
// Parametr 2: 2
 
jakasFunkcja(1, 2, 3);
// Parametr 1: 1
// Parametr 2: 2

Jak można zauważyć, za pierwszym razem wywołaliśmy funkcję bez parametrów i każdy parametr wymagany został zdefiniowany jako undefined. W drugim przypadku, wywołaliśmy funkcję z jednym parametrem. Dlatego tylko parametr drugi jest undefined. W kolejnym przypadku obydwa parametry zostały przekazane i mają określoną wartość. Ostatni przypadek jest jednak najciekawszy, ponieważ przekazujemy do funkcji 3 parametry i pierwsze 2 są poprawnie zdefiniowane, a trzeci jest ignorowany. Mimo to, w dalszym ciągu mamy dostęp do trzeciego parametru z funkcji dzięki parametrowi arguments, który przechowuje informacje o wszystkich parametrach przekazanych do funkcji. Do parametrów możemy się dostać w następujący sposób:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var innaFunkcja = function () {
  // za pomocą pętli dostajemy się do każdego parametru przekazanego w funkcji
  for (var i = 0; i < arguments.length; i++) {
    console.log(i, ' - Parametr', arguments[i]);
  }
};
 
innaFunkcja(1, 2, 3, 4, 5);
 
// 0 - Parametr 1
// 1 - Parametr 2
// 2 - Parametr 3
// 3 - Parametr 4
// 4 - Parametr 5

Należy pamiętać, że parametru arguments nie nadpisywać w ciele funkcji, jeśli chcemy móc skorzystać ze wszystkich niezdefiniowanych parametrów w danej funkcji.

Definiowanie wartości domyślnej dla parametrów

W chwili obecnej, pisząc kod w JS nie możemy definiować wartości domyślnych dla parametrów funkcji tak jak to ma miejsce chociażby w kodzie PHP. Czyli nie jesteśmy w stanie pisać kodu w następujący sposób:

1
var kolejnaFunkcja = function (a, b = 2) {};

Jesteśmy w stanie jednak zdefiniować wartość domyślną dla funkcji, tylko trochę inaczej niż ma to miejsce w PHP. Robimy to w następujący sposób:

1
2
3
4
var kolejnaFunkcja = function (a, b) {
  a = a || 1;
  b = b || 2;
};

W powyższym kodzie, wewnątrz funkcji sprawdzamy czy parametr zwraca jakąkolwiek wartość, a jeśli nie to przypisujemy mu domyślną wartość. Tym samym uzyskujemy funkcjonalność ustawiania wartości domyślnej dla parametrów funkcji.

Co ciekawe, wraz z coraz większym rozpowszechnianiem standardu ECMAScript 6 za jakiś czas będzie można zacząć korzystać z tego pierwszego, niepoprawnego zapisu i będzie on poprawnie obsługiwany.

Podsumowanie

Ten artykuł miał na celu przedstawić sposoby obsługi parametrów w funkcjach Javascript. Jest to prosta do stosowania wiedza, ale bardzo użyteczna i sprawdza się w wielu przypadkach. Sam korzystam z niej na co dzień i mam nadzieję, że Tobie też się przyda tego typu wiedza.