JavaScript - Currying: Ein Anfängerleitfaden

Hallo da draußen, angehende Programmierer! Heute machen wir uns auf eine aufregende Reise in die Welt von JavaScript und erkunden ein Konzept namens "Currying". Keine Sorge, wenn Sie noch nie zuvor davon gehört haben – wir beginnen mit den Grundlagen und arbeiten uns hoch. Bis zum Ende dieses Tutorials werden Sie Funktionen wie ein Profi kürzen!

JavaScript - Currying

Was ist Currying?

Bevor wir uns den Wie-zu's widmen, lassen Sie uns verstehen, was Currying eigentlich ist. Currying ist eine Technik in der funktionalen Programmierung, bei der wir eine Funktion, die mehrere Argumente akzeptiert, in eine Folge von Funktionen umwandeln, die jeweils ein einzelnes Argument annehmen.

Stellen Sie sich vor, Sie machen ein Sandwich. Anstatt alle Zutaten auf einmal hinzuzufügen, ist Currying so, als ob Sie eine Zutat nach der anderen hinzufügen, Schritt für Schritt. Es gibt Ihnen mehr Kontrolle und Flexibilität darüber, wie Sie Ihr "Funktions-Sandwich" zusammenstellen.

Currying in JavaScript erreichen

Nun schauen wir uns an, wie wir Currying in JavaScript implementieren können. Wir werden zwei Hauptmethoden untersuchen: die Verwendung von Closures und die Verwendung der bind()-Methode.

Currying mit Closures

Closures sind wie magische Kisten in JavaScript, die sich an die Umgebung erinnern, in der sie erstellt wurden. Wir können diese Superkraft nutzen, um gekürzte Funktionen zu erstellen. Lassen Sie uns mit einem einfachen Beispiel beginnen:

function curry(f) {
return function(a) {
return function(b) {
return f(a, b);
};
};
}

function sum(a, b) {
return a + b;
}

let curriedSum = curry(sum);

console.log(curriedSum(2)(3)); // Ausgabe: 5

In diesem Beispiel:

  1. curry ist eine higher-order-Funktion, die eine andere Funktion f als Argument annimmt. Sie gibt eine neue Funktion zurück, die das erste Argument a annimmt, die ihrerseits eine andere Funktion zurückgibt, die das zweite Argument b annimmt. Schließlich ruft sie die ursprüngliche Funktion f mit beiden Argumenten auf.

Lassen Sie uns das Schritt für Schritt auseinandernehmen:

  1. Wir definieren eine curry-Funktion, die unsere reguläre Funktion in eine gekürzte umwandelt.
  2. Wir haben eine einfache sum-Funktion, die zwei Zahlen addiert.
  3. Wir erstellen eine curriedSum, indem wir sum an unsere curry-Funktion übergeben.
  4. Wenn wir curriedSum(2)(3) aufrufen, geschieht actually folgendes:
  • curriedSum(2) gibt eine Funktion zurück, die 2 als erstes Argument "erinnert".
  • Wir rufen diese zurückgegebene Funktion sofort mit (3) auf, was die Operation vervollständigt.

Cool, oder? Es ist, als ob wir unseren Funktionsaufruf piece by piece aufbauen!

Currying mit der bind()-Methode

JavaScript stellt uns auch eine integrierte Methode namens bind() zur Verfügung, die wir für Currying verwenden können. Die bind()-Methode erstellt eine neue Funktion, die, wenn sie aufgerufen wird, ihr this-Schlüsselwort auf einen bereitgestellten Wert setzt und eine gegebene Sequenz von Argumenten vor jeglichen bereitstellt, die bei dem Aufruf der neuen Funktion übergeben werden.

Schauen wir uns an, wie wir bind() für Currying verwenden können:

function multiply(x, y) {
return x * y;
}

let multiplyByTwo = multiply.bind(this, 2);
console.log(multiplyByTwo(4)); // Ausgabe: 8

let multiplyByThree = multiply.bind(this, 3);
console.log(multiplyByThree(4)); // Ausgabe: 12

In diesem Beispiel:

  1. Wir beginnen mit einer einfachen multiply-Funktion, die zwei Argumente annimmt.
  2. Wir verwenden bind() um eine neue Funktion multiplyByTwo zu erstellen. Das Argument 2 ist voreingestellt als erstes Argument.
  3. Wenn wir multiplyByTwo(4) aufrufen, ruft es effektiv multiply(2, 4) auf.
  4. Wir tun dasselbe, um multiplyByThree zu erstellen, indem wir 3 als erstes Argument voreinstellen.

Die bind()-Methode ermöglicht es uns, bestimmte Argumente einer Funktion zu "fixieren", eine neue Funktion mit diesen Argumenten bereits gesetzt zu erstellen.

Anwendungsfälle von Currying

Nun, da wir verstehen, wie man Funktionen kürzt, lassen uns erkunden, warum wir das überhaupt tun möchten. Currying hat mehrere praktische Anwendungen in JavaScript:

  1. Funktionsverkettung: Currying macht es einfacher, Funktionen zu verketten, wobei die Ausgabe einer Funktion die Eingabe einer anderen wird.

  2. Partielle Anwendungen: Wir können spezialisierte Funktionen aus allgemeineren Funktionen erstellen, wie in unserem Beispiel multiplyByTwo.

  3. Vermeidung von Wiederholungen: Wenn Sie feststellen, dass Sie eine Funktion ständig mit denselben Argumenten aufrufen, kann Currying dabei helfen, Wiederholungen zu reduzieren.

  4. Ereignisbehandlung: In der Frontend-Entwicklung kann Currying nützlich sein, um Ereignisse mit zusätzlichen Parametern zu behandeln.

Schauen wir uns ein realweltliches Beispiel der Verwendung von Currying für Ereignisbehandlung an:

function handleClick(message, event) {
console.log(message, event.target);
}

let button = document.getElementById('myButton');
button.addEventListener('click', handleClick.bind(null, 'Button clicked:'));

In diesem Beispiel verwenden wir Currying, um ein zusätzliches Parameter an unseren Ereignis-Handler zu übergeben. Wenn der Knopf geklickt wird, wird es "Button clicked:" gefolgt vom Ereignisziel ausgeben.

Methoden für Currying in JavaScript

Hier ist eine Tabelle, die die Methoden zusammenfasst, die wir besprochen haben, um Currying in JavaScript zu erreichen:

Methode Beschreibung Beispiel
Closures Verwendet verschachtelte Funktionen, um gekürzte Funktionen zu erstellen function curry(f) { return function(a) { return function(b) { return f(a, b); }; }; }
bind() Verwendet die bind()-Methode, um Argumente vorzubelegen let multiplyByTwo = multiply.bind(this, 2);

Schlussfolgerung

Glückwunsch! Sie haben gerade Ihre ersten Schritte in die Welt des Currying in JavaScript gemacht. Denken Sie daran, wie beim Lernen jedes neuen Programmierkonzepts, ist Übung der Schlüssel. Versuchen Sie, Ihre eigenen gekürzten Funktionen zu erstellen und experimentieren Sie mit verschiedenen Anwendungsfällen.

Currying mag zunächst etwas abstrakt erscheinen, aber je öfter Sie es verwenden, desto mehr werden Sie sehen, wie es Ihren Code flexibler und wiederverwendbarer machen kann. Es ist wie das Lernen eines neuen Werkzeugs in Ihrer Programmierwerkzeugkiste – anfangs mag es seltsam erscheinen, aber bald werden Sie sich fragen, wie Sie ohne es je programmiert haben!

Weiterschreiben, weiterlernen und vor allem: haben Sie Spaß! JavaScript ist ein Spielplatz der Möglichkeiten, und Currying ist nur eine von vielen aufregenden Funktionen, die darauf warten, von Ihnen entdeckt zu werden.

Credits: Image by storyset