5.1 Grundkonzepte
Funktionen höherer Ordnung sind ein wesentlicher Aspekt der funktionalen Programmierung und werden in JavaScript weit verbreitet genutzt. Sie ermöglichen es, abstrakteren, kompakteren und wiederverwendbaren Code zu schreiben.
Was sind Funktionen höherer Ordnung?
Funktionen höherer Ordnung (higher-order functions) sind Funktionen, die andere Funktionen als Argumente annehmen oder Funktionen als Ergebnis zurückgeben. Sie erlauben es, Funktionen als erstklassige Objekte zu verwenden, was die Erstellung von abstrakteren und modulareren Programmen ermöglicht.
Beispiele für Funktionen höherer Ordnung
- Funktionen als Argumente übergeben.
- Funktionen aus anderen Funktionen zurückgeben.
5.2 Funktionen als Argumente übergeben
Verwendung eingebauter Array-Methoden
JavaScript bietet viele eingebaute Methoden zur Arbeit mit Arrays, die als Funktionen höherer Ordnung fungieren, wie forEach(), map(), filter(), reduce() und andere.
1. Methode forEach()
Die Methode forEach() führt die angegebene Funktion einmal für jedes Element des Arrays aus.
const numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(number) {
console.log(number);
});
// Zeigt an: 1 2 3 4 5
2. Methode map()
Die Methode map() erstellt ein neues Array mit den Ergebnissen des Aufrufs der angegebenen Funktion für jedes Element des Arrays.
const numbers = [1, 2, 3, 4, 5];
const squaredNumbers = numbers.map(function(number) {
return number * number;
});
console.log(squaredNumbers);
// Zeigt an: [1, 4, 9, 16, 25]
3. Methode filter()
Die Methode filter() erstellt ein neues Array mit allen Elementen, die den Test bestehen, der in der übergebenen Funktion definiert ist.
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(function(number) {
return number % 2 === 0;
});
console.log(evenNumbers);
// Zeigt an: [2, 4]
4. Methode reduce()
Die Methode reduce() wendet eine Funktion auf den Akkumulator und jedes Element des Arrays (von links nach rechts) an und reduziert es auf einen einzigen Wert.
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce(function(total, number) {
return total + number;
}, 0);
console.log(sum);
// Zeigt an: 15
5.3 Funktionen aus anderen Funktionen zurückgeben
Funktionen höherer Ordnung können andere Funktionen zurückgeben, was die Erstellung flexiblerer und konfigurierbarer Funktionen ermöglicht.
1. Currying
Currying ist der Prozess der Umwandlung einer Funktion, die mehrere Argumente nimmt, in eine Funktion, die ein Argument nimmt und eine neue Funktion zurückgibt, die das nächste Argument nimmt, und so weiter.
Beispiel für Currying:
function multiply(a) {
return function(b) {
return a * b;
};
}
const multiplyByTwo = multiply(2);
console.log(multiplyByTwo(5)); // Zeigt an: 10
const multiplyByThree = multiply(3);
console.log(multiplyByThree(5)); // Zeigt an: 15
2. Erstellung anpassbarer Funktionen
Funktionen höherer Ordnung ermöglichen es, Funktionen zu erstellen, die durch Argumente angepasst werden können.
Beispiel:
function createGreeting(greeting) {
return function(name) {
console.log(`${greeting}, ${name}!`);
};
}
const sayHello = createGreeting('Hello');
sayHello('Alice'); // Zeigt an: Hello, Alice!
const sayHi = createGreeting('Hi');
sayHi('Bob'); // Zeigt an: Hi, Bob!
5.4 Praktische Anwendung
Betrachten wir die praktische Anwendung von Funktionen höherer Ordnung.
Funktion compose()
Die Funktion compose() ermöglicht es, mehrere Funktionen zu einer zu kombinieren, die sie in einer Kette anwendet:
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)); // Zeigt an: 12 (zuerst wird 1 zu 5 hinzugefügt, dann das Ergebnis verdoppelt)
Asynchrone Funktionen höherer Ordnung
Asynchrone Funktionen höherer Ordnung ermöglichen es, mit asynchronen Operationen wie API-Anfragen oder Timer-Arbeiten zu arbeiten:
function fetchData(callback) {
setTimeout(() => {
callback('Data received');
}, 1000);
}
function processData(data) {
console.log(data);
}
fetchData(processData);
// Zeigt an: Data received (nach 1 Sekunde)
GO TO FULL VERSION