Lekcja 6: Funkcje

Funkcje to bloki kodu, które można zdefiniować raz i wywoływać wielokrotnie w różnych miejscach programu. Pozwalają na organizację kodu, jego reużywalność i tworzenie bardziej złożonych aplikacji.

Definiowanie funkcji

Istnieje kilka sposobów definiowania funkcji w JavaScript:

Deklaracja funkcji (Function Declaration)

Najbardziej klasyczny sposób. Funkcje zadeklarowane w ten sposób są poddawane hoistingowi, co oznacza, że można je wywołać przed ich definicją w kodzie.

function nazwaFunkcji(parametr1, parametr2) {
    // Ciało funkcji - kod do wykonania
    console.log("Parametr 1:", parametr1);
    console.log("Parametr 2:", parametr2);
    // Opcjonalnie: zwracanie wartości
    return parametr1 + parametr2;
}

// Wywołanie funkcji
let wynik = nazwaFunkcji(5, 10);
console.log("Wynik funkcji:", wynik); // Wynik funkcji: 15

Wyrażenie funkcyjne (Function Expression)

Funkcja jest przypisywana do zmiennej. Takie funkcje nie są hoistowane - nie można ich wywołać przed definicją.

const mojaFunkcja = function(parametr) {
    console.log("Wywołano wyrażenie funkcyjne z parametrem:", parametr);
    return parametr * 2;
};

// Wywołanie funkcji
let rezultat = mojaFunkcja(7);
console.log("Rezultat:", rezultat); // Rezultat: 14

Wyrażenia funkcyjne mogą być anonimowe (jak powyżej) lub nazwane (co jest przydatne przy debugowaniu).

Funkcje strzałkowe (Arrow Functions - ES6)

Bardziej zwięzły sposób zapisu funkcji, wprowadzony w ES6. Mają kilka istotnych różnic w zachowaniu (np. dotyczących słowa kluczowego this), które omówimy później.

// Najprostsza forma
const powitaj = () => {
    console.log("Witaj!");
};

powitaj(); // Witaj!

// Z jednym parametrem (nawiasy opcjonalne)
const kwadrat = x => {
    return x * x;
};
// Lub jeszcze krócej (niejawny return)
const kwadratKrotko = x => x * x;

console.log(kwadrat(4)); // 16
console.log(kwadratKrotko(5)); // 25

// Z wieloma parametrami
const suma = (a, b) => {
    return a + b;
};
// Lub krócej
const sumaKrotko = (a, b) => a + b;

console.log(suma(3, 8)); // 11
console.log(sumaKrotko(10, 2)); // 12

Parametry i argumenty

• Parametry: Zmienne wymienione w definicji funkcji (np. parametr1, parametr2 w function nazwaFunkcji(parametr1, parametr2)).
• Argumenty: Rzeczywiste wartości przekazywane do funkcji podczas jej wywołania (np. 5 i 10 w nazwaFunkcji(5, 10)).

Parametry domyślne (ES6)

Można zdefiniować domyślne wartości dla parametrów, które zostaną użyte, jeśli argument nie zostanie przekazany.

function przywitaj(imie = "Gościu") {
    console.log(`Witaj, ${imie}!`);
}

przywitaj("Anna"); // Witaj, Anna!
przywitaj();      // Witaj, Gościu!

Parametry resztowe (Rest Parameters - ES6)

Pozwalają na zebranie dowolnej liczby pozostałych argumentów w tablicę.

function sumujWszystko(...liczby) {
    let suma = 0;
    for (const liczba of liczby) {
        suma += liczba;
    }
    return suma;
}

console.log(sumujWszystko(1, 2, 3));       // 6
console.log(sumujWszystko(10, 20, 30, 40)); // 100
console.log(sumujWszystko(5));           // 5
console.log(sumujWszystko());          // 0

Zwracanie wartości (`return`)

Instrukcja return kończy wykonanie funkcji i opcjonalnie zwraca wartość do miejsca wywołania. Jeśli funkcja nie ma instrukcji return lub ma return bez wartości, domyślnie zwraca undefined.

function czyPelnoletni(wiek) {
    if (wiek >= 18) {
        return true;
    } else {
        return false;
    }
    // Lub krócej: return wiek >= 18;
}

let status = czyPelnoletni(25);
console.log("Czy pełnoletni?", status); // Czy pełnoletni? true

function nicNieZwraca() {
    console.log("Ta funkcja nic nie zwraca jawnie.");
}

let wynikPusty = nicNieZwraca();
console.log("Wynik pustej funkcji:", wynikPusty); // Wynik pustej funkcji: undefined

Zakres zmiennych (Scope)

Określa, gdzie w kodzie zmienne są dostępne.

• Zakres globalny: Zmienne zadeklarowane poza jakąkolwiek funkcją są dostępne wszędzie.
• Zakres lokalny (funkcyjny): Zmienne zadeklarowane wewnątrz funkcji (za pomocą var, let, const) są dostępne tylko w tej funkcji.
• Zakres blokowy (ES6): Zmienne zadeklarowane za pomocą let i const wewnątrz bloku kodu (np. w if, for) są dostępne tylko w tym bloku.

let globalnaZmienna = "Jestem globalna";

function mojaFunkcja() {
    let lokalnaZmienna = "Jestem lokalna";
    console.log(globalnaZmienna); // Dostęp do zmiennej globalnej
    console.log(lokalnaZmienna);  // Dostęp do zmiennej lokalnej

    if (true) {
        let blokowaZmienna = "Jestem blokowa";
        console.log(blokowaZmienna);
    }
    // console.log(blokowaZmienna); // Błąd: blokowaZmienna is not defined
}

mojaFunkcja();
// console.log(lokalnaZmienna); // Błąd: lokalnaZmienna is not defined

// Deklaracja funkcji
function obliczPoleProstokata(a, b) {
    if (typeof a !== 'number' || typeof b !== 'number' || a <= 0 || b <= 0) {
        return "Nieprawidłowe wymiary"; // Obsługa błędnych danych
    }
    return a * b;
}

// Wywołanie funkcji
let bok1 = 7;
let bok2 = 4;
let pole = obliczPoleProstokata(bok1, bok2);

console.log(`Pole prostokąta o bokach ${bok1} i ${bok2} wynosi: ${pole}`); // Wynik: 28

// Test z błędnymi danymi
console.log(obliczPoleProstokata(5, -2)); // Wynik: Nieprawidłowe wymiary
console.log(obliczPoleProstokata(10, "abc")); // Wynik: Nieprawidłowe wymiary