Funkcje wyższego rzędu

5.1 Podstawowe pojęcia

Funkcje wyższego rzędu są ważnym elementem programowania funkcyjnego i są szeroko stosowane w JavaScript. Pozwalają pisać bardziej abstrakcyjny, zwarty i wielokrotnie używany kod.

Czym są funkcje wyższego rzędu?

Funkcje wyższego rzędu (higher-order functions) to funkcje, które przyjmują jako argumenty inne funkcje lub zwracają funkcje jako rezultat. Dzięki temu możemy traktować funkcje jako obiekty pierwszej klasy, co pozwala tworzyć bardziej abstrakcyjne i modułowe programy.

Przykłady funkcji wyższego rzędu

1. Przekazywanie funkcji jako argumentów.
2. Zwracanie funkcji z innych funkcji.

5.2 Przekazywanie funkcji jako argumentów

Wykorzystanie wbudowanych metod tablic

JavaScript oferuje wiele wbudowanych metod do pracy z tablicami, które są funkcjami wyższego rzędu, takich jak forEach(), map(), filter(), reduce() i inne.

1. Metoda forEach()

Metoda forEach() wykonuje określoną funkcję raz dla każdego elementu tablicy.

    
      const numbers = [1, 2, 3, 4, 5];

      numbers.forEach(function(number) {
        console.log(number);
      });
      // Wyświetli: 1 2 3 4 5
    
  

2. Metoda map()

Metoda map() tworzy nową tablicę z wynikami wywołania określonej funkcji dla każdego elementu tablicy.

    
      const numbers = [1, 2, 3, 4, 5];
      const squaredNumbers = numbers.map(function(number) {
        return number * number;
      });

      console.log(squaredNumbers);
      // Wyświetli: [1, 4, 9, 16, 25]
    
  

3. Metoda filter()

Metoda filter() tworzy nową tablicę z wszystkimi elementami, które przeszły test określony w podanej funkcji.

    
      const numbers = [1, 2, 3, 4, 5];
      const evenNumbers = numbers.filter(function(number) {
        return number % 2 === 0;
      });

      console.log(evenNumbers);
      // Wyświetli: [2, 4]
    
  

4. Metoda reduce()

Metoda reduce() stosuje funkcję do akumulatora i każdego elementu tablicy (od lewej do prawej), redukując ją do jednej wartości.

    
      const numbers = [1, 2, 3, 4, 5];
      const sum = numbers.reduce(function(total, number) {
        return total + number;
      }, 0);

      console.log(sum);
      // Wyświetli: 15
    
  

5.3 Zwracanie funkcji z innych funkcji

Funkcje wyższego rzędu mogą zwracać inne funkcje, co pozwala tworzyć bardziej elastyczne i konfigurowalne funkcje.

1. Currying

Currying to proces przekształcania funkcji, która przyjmuje kilka argumentów, w funkcję, która przyjmuje jeden argument i zwraca nową funkcję, która przyjmuje następny argument, i tak dalej.

Przykład currying:

    
      function multiply(a) {
        return function(b) {
          return a * b;
        };
      }

      const multiplyByTwo = multiply(2);
      console.log(multiplyByTwo(5)); // Wyświetli: 10

      const multiplyByThree = multiply(3);
      console.log(multiplyByThree(5)); // Wyświetli: 15
    
  

2. Tworzenie konfigurowalnych funkcji

Funkcje wyższego rzędu pozwalają tworzyć funkcje, które można skonfigurować za pomocą argumentów.

Przykład:

    
      function createGreeting(greeting) {
        return function(name) {
          console.log(`${greeting}, ${name}!`);
        };
      }

      const sayHello = createGreeting('Hello');
      sayHello('Alice'); // Wyświetli: Hello, Alice!

      const sayHi = createGreeting('Hi');
      sayHi('Bob'); // Wyświetli: Hi, Bob!
    
  

5.4 Praktyczne zastosowanie

Zobaczmy praktyczne zastosowanie funkcji wyższego rzędu.

Funkcja compose()

Funkcja compose() pozwala łączyć kilka funkcji w jedną, która stosuje je sekwencyjnie:

    
      function compose(...functions) {
        return function(initialValue) {
          return functions.reduceRight((value, func) => func(value), initialValue);
        };
      }

      const addOne = x => x + 1;
      const double = x => x * 2;
      const addOneAndDouble = compose(double, addOne);
      console.log(addOneAndDouble(5)); // Wyświetli: 12 (najpierw dodaje 1 do 5, a potem podwaja wynik)
    
  

Asynchroniczne funkcje wyższego rzędu

Asynchroniczne funkcje wyższego rzędu pozwalają pracować z operacjami asynchronicznymi, takimi jak zapytania do API czy praca z timerami:

    
      function fetchData(callback) {
        setTimeout(() => {
          callback('Data received');
        }, 1000);
      }

      function processData(data) {
        console.log(data);
      }

      fetchData(processData);
      // Wyświetli: Data received (po 1 sekundzie)