Funkcje
Czas na kolejną dawkę wiedzy. Przedstawiamy funkcję, czyli blok kodu służący do wykonywania określonego zadania. Co ważne, należy ją wywołać. Zapoznaj się z przykładem, aby zrozumieć, co to znaczy. Zacznijmy od składni funkcji.
function name(parameter) {
// kod do wykonania
}Poznaj składniki funkcji:
- słowo kluczowe function,
- nazwa funkcji (może być dowolna, ale zaleca się, aby składała się z czasowników np. checkName),
- jednym parametrze lub wielu parametrach, zapisywanych w nawiasie (uwaga, funkcja może też nie przyjmować żadnych parametrów),
- kod do wykonania zapisywany w nawiasach klamrowych.
W parametrze możesz przekazywać m.in. dowolne słowo np. "ananas", a funkcja ma wykonać określone zadanie np. zmienić wielkość znaków, odwrócić kolejność liter czy też sprawdzić, ile razy powtarza się znak "a". W naszym przykładzie przekażemy dwie zmienne liczbowe, a zadaniem funkcji będzie je pomnożyć.
function multiply(num1, num2) { //funkcji można podać więcej niż jeden parametr
return num1*num2;
}Nasza funkcja nazywa się multiply. Aby ją wywołać, należy podać jej nazwę, a następnie parametry. W miejsce num1 i num2 wpisujemy zatem liczby, które chcemy pomnożyć, w naszym przypadku 4 i 5. Czas na wywołanie funkcji:
multiply(4,5);Oto przykład funkcji multiply:
Co się stało? Wywołaliśmy zadeklarowaną wcześniej funkcję multiply, a pod parametry num1 i num2 podstawiliśmy dwie liczby. Wnętrze funkcji podczas takiego wywołania wygląda zatem tak: return 4*5, a zwracany jest wynik tego mnożenia czyli 20. Pamiętaj, aby zawsze używać nawiasów okrągłych, nawet jeżeli funkcja nie przyjmuje żadnych parametrów, co też jest możliwe.
Return
Funkcje muszą zawsze coś zwracać. Gdyby tego nie robiły, wykonywały by się wewnątrz siebie, ale nic nie byłoby zauważalne na zewnątrz. Wyobraź sobie rzemieślnika pracującego w zaciszu swojego warsztatu. Jeżeli nie wyniesie stamtąd efektów swojej pracy, nikt nie będzie w stanie z nich skorzystać. Do przekazywania efektu działania funkcji służy właśnie słowo kluczowe return. Kod w kolejnych liniach nie będzie wykonany, więc należy zapamiętać, że to słowo kluczowe ma być zawsze ostatnie.
function multiply(num1, num2) {
num1*num2;
}
multiply(4, 5);Taka funkcja nic nam nie zwróci. Nasz rzemieślnik wykona zadanie, ale wynik zachowa dla siebie. Bardzo wygodne jest przypisywanie wyniku funkcji do zmiennej (tak jak zrobiliśmy to w powyższym przykładzie), dzięki czemu będziemy mogli korzystać z efektu tej pracy wielokrotnie np.
var result = multiply(4, 5);Wynik działania funkcji mamy teraz w zmiennej result, z której później będziemy mogli swobodnie korzystać.
Zadania
Zadanie 1
Spójrz na kod w pliku JavaScript. Znajdziesz tam funkcję wypisującą tekst. Wywołaj ją.
Przejdź do pierwszego zadania:
Wskazówka: Funkcję wywołuje się poprzez podanie jej nazwy z nawiasami okrągłymi, bez parametrów.
Zadanie 2
Spójrz na plik JS. Znajdziesz tam funkcję oraz zmienną, do której przypisany jest jej wynik. Następnie sama zmienna jest wyświetlana poniżej. Funkcja ta przyjmuje dwa parametry i zwraca wynik ich mnożenia. Popraw wywołanie funkcji tak, żeby równanie (5 * 12 = NaN) było prawidłowe.
Przejdź do drugiego zadania:
Wskazówka: W razie problemów porównaj parametry przy deklaracji funkcji oraz jej wywołaniu w zmiennej oraz przeczytaj jeszcze raz sekcję na temat parametrów funkcji.
Zadanie 3
Spójrz na kod w pliku JavaScript. Wywołaj znajdującą się tam funkcję w taki sposób, aby pod spodem pojawiło się powitanie z Twoim imieniem.
Przejdź do trzeciego zadania:
Wskazówka: Wystarczy przy deklaracji funkcji zastąpić parametr name wartością, która go zastąpi.
Zadanie 4
Spójrz na kod do zadania 4 w pliku JavaScript. Znajduje się tam funkcja przeliczająca stopnie Fahrenheita na Celsjusza. Do zmiennej fahrenheit przypisz temperaturę, którą chcesz przeliczyć. Natomiast do zmiennej result2 przypisz wynik tej funkcji, a w nawiasach podaj zmienną fahrenheit.
Przejdź do czwartego zadania:
Wskazówka: Jeżeli wszystko jest poprawnie dla np. 50° fahrenheita wynik powinien dać 10° Celsjusza.
Zadanie 5
Czas na napisanie własnej funkcji. W pliku JS masz miejsce na napisanie własnej funkcji. Nadaj jej dowolną nazwę, ale pamiętaj o dobrych praktykach. Funkcja ma przyjmować parametr o dowolnej nazwie: twój wiek (np. 27), a zwracać rok urodzenia (np. 1990). Jak napisać kod? Od bieżącego roku należy odjąć podany parametr ( np. return 2017 - parametr;) i zwrócić wynik.
Następnie wywołaj funkcję i zapisz jej wynik do przygotowanej już zmiennej birthYear. Jeżeli wszystko zostało zrobione poprawnie, to rok Twojego urodzenia powinien się wyświetlić poprawnie.
Przejdź do piątego zadania:
Wskazówka: Jeżeli nie masz pewności, jak napisać funkcję, to przyjrzyj się wzorowi z części teoretycznej, a następnie podmień poszczególne części.
