Funkcje

3.1 Deklaracja funkcji

Funkcje to jedne z podstawowych elementów budulcowych w JavaScript. Pozwalają ci zorganizować kod, ponownie używać logiki i tworzyć bardziej złożone struktury. Przyjrzymy się trzem głównym sposobom deklarowania i używania funkcji: deklaracje funkcji, wyrażenia funkcyjne i funkcje-strzałki.

Deklaracja funkcji — to sposób tworzenia nazwanej funkcji, którą można wywołać później. Takie funkcje są "hoisted" na szczyt ich lokalnego zasięgu, co pozwala na ich wywołanie przed deklaracją w kodzie.

Składnia:

    
      function name (arguments) {
        // ciało funkcji
      }
    
  

Przykład użycia:

    
      // Deklaracja funkcji
      function greet(name) {
        return `Hello, ${name}!`;
      }

      // Wywołanie funkcji
      console.log(greet('Alice')); // Wyświetli: Hello, Alice!
    
  

3.2 Wyrażenia funkcyjne

Wyrażenia funkcyjne tworzą anonimowe funkcje (funkcje bez nazwy) i mogą być przypisane do zmiennej. Takie funkcje nie są "hoisted", więc można je wywołać tylko po deklaracji.

Składnia:

    
      const name = function (arguments) {
        // ciało funkcji
      }
    
  

Przykład użycia:

    
      // Wyrażenie funkcyjne

      const greet = function(name) {
        return `Hello, ${name}!`;
      };

      // Wywołanie funkcji
      console.log(greet('Bob')); // Wyświetli: Hello, Bob!
    
  

3.3 Funkcje-strzałki

Funkcje-strzałki (arrow functions) to zwięzły sposób deklarowania funkcji, który także zachowuje kontekst this z nadrzędnego zasięgu. Funkcje-strzałki nie mają własnego this, więc są szczególnie przydatne w obsłudze zdarzeń i metodach tablicowych.

Składnia:

    
      const name = (arguments) => {
        // ciało funkcji
      }
    
  

Jeśli funkcja przyjmuje jeden parametr, nawiasy można pominąć. Jeśli funkcja zwraca jedno wyrażenie, można pominąć nawiasy klamrowe i słowo kluczowe return.

Przykład 1: Pełna notacja

    
      // Funkcja-strzałka

      const greet = (name) => {
        return `Hello, ${name}!`;
      };

      // Wywołanie funkcji
      console.log(greet('Charlie')); // Wyświetli: Hello, Charlie!
    
  

Przykład 2: Skrócona notacja

    
      // Funkcja-strzałka z jednym parametrem i jednym wyrażeniem
      const greet = name => `Hello, ${name}!`;

      // Wywołanie funkcji
      console.log(greet('Dana')); // Wyświetli: Hello, Dana!
    
  

3.4 Porównanie sposobów deklarowania funkcji

Hoisting:

• Deklaracja funkcji: funkcje są hoisted, co pozwala na ich wywołanie przed deklaracją
• Wyrażenia funkcyjne i Funkcje-strzałki: nie są hoisted, można je wywołać tylko po deklaracji

Kontekst this:

• Deklaracja funkcji i Wyrażenia funkcyjne: mają własny kontekst this
• Funkcje-strzałki: nie mają własnego this, kontekst jest dziedziczony z nadrzędnego zasięgu

Zwięzłość zapisu:

• Funkcje-strzałki: bardziej zwięzłe i często używane dla krótkich funkcji i callbacków