Heim >Web-Frontend >js-Tutorial >5 Möglichkeiten, Ihr JavaScript funktionaler zu gestalten
In diesem Artikel wird kurz das Konzept der funktionalen Programmierung vorgestellt und fünf Möglichkeiten erklärt, den funktionalen Stil des JavaScript -Code zu verbessern.
Kernpunkte
const
immer deklariert werden. for
Loops in der funktionellen Programmierung sollten vermieden werden, da sie von mutablen Zuständen abhängen. Stattdessen sollten rekursive Array-Methoden mit Array-Methoden höherer Ordnung verwendet werden. Zusätzlich sollte der Typ -Zwang vermieden werden, um die Typ -Konsistenz aufrechtzuerhalten. Dies kann durch Schreiben von Typ Deklaration -Kommentaren vor der Deklaration der Funktion erfolgen. Was ist eine funktionale Programmierung?
funktionale Programmierung ist ein Programmierparadigma, das Funktionen und ihre Anwendungen verwendet, anstatt eine Liste von Befehlen, die in der Programmiersprache imperativ verwendet werden.
Dies ist ein abstrakterer Programmierstil mit Wurzeln in der Mathematik - insbesondere der mathematische Zweig namens Lambda Calculus, das 1936 von der Mathematiker Alonzo Church als formales Modell der Computertation entworfen wurde. Es besteht aus Ausdrücken und Funktionen, die einen Ausdruck einem anderen abbilden. Grundsätzlich tun wir dies in der funktionalen Programmierung: Wir verwenden Funktionen, um Werte in verschiedene Werte umzuwandeln.
Der Autor dieses Artikels hat sich in den letzten Jahren in die funktionelle Programmierung verliebt. Wir haben begonnen, JavaScript -Bibliotheken zu verwenden, die mehr funktionale Stile fördern, und dann direkt ins tiefe Wasser gesprungen, indem sie lernen, wie man Code in Haskell schreibt.
Haskell ist eine rein funktionelle Programmiersprache, die in den 1990er Jahren entwickelt wurde, ähnlich wie Scala und Clojure. Mit diesen Sprachen werden Sie gezwungen sein, in einen funktionalen Stil zu codieren. Das Lernen von Haskell gibt uns ein echtes Verständnis für alle Vorteile der funktionalen Programmierung.
JavaScript ist eine Multi-Paradigmen-Sprache, da sie verwendet werden kann, um in einem imperativen, objektorientierten oder funktionalen Stil zu programmieren. Es passt jedoch besonders gut zum funktionalen Stil, da Funktionen erstklassige Objekte sind, was bedeutet, dass sie Variablen zugewiesen werden können. Dies bedeutet auch, dass Funktionen als Argumente an andere Funktionen (normalerweise als Rückrufe genannt) oder als Rückgabewerte für andere Funktionen übergeben werden können. Funktionen, die andere Funktionen zurückgeben oder andere Funktionen als Parameter akzeptieren, werden als Funktionen höherer Ordnung bezeichnet und sind der grundlegende Teil der funktionalen Programmierung.
In den letzten Jahren wurde das Programmieren von JavaScript im funktionalen Stil immer beliebter, insbesondere nach dem Aufstieg von React. React verwendet eine deklarative API, die für funktionelle Methoden geeignet ist. Ein solides Verfassen der funktionellen Programmierprinzipien verbessert Ihren React -Code.
Warum ist die funktionale Programmierung so ausgezeichnet?
in kurzen, funktionalen Programmiersprachen führen häufig dazu, dass der Code präzise, klar und elegant ist. Der Code ist normalerweise einfacher zu testen und kann ohne Probleme in einer Umgebung mit mehreren Threads ausgeführt werden.
Wenn Sie mit vielen verschiedenen Programmierern sprechen, werden Sie möglicherweise völlig unterschiedliche Meinungen über funktionale Programme von allen erhalten - von denen, die es absolut hassen, bis zu denen, die es absolut lieben. Wir (der Autor dieses Artikels) stehen auf der Seite von "Love It", aber wir verstehen voll und ganz, dass es nicht das Gericht aller ist, zumal es sich sehr von der Art und Weise unterscheidet, wie wir normalerweise unterrichten.
, aber sobald Sie die funktionale Programmierung beherrschen und sobald der Denkprozess eingerichtet wird, wird es zur zweiten Natur und ändert die Art und Weise, wie Sie Ihren Code schreiben.
Regel 1: Reinigen Sie Ihre Funktion
Der wichtigste Teil der funktionalen Programmierung besteht darin, sicherzustellen, dass die von Ihnen geschriebenen Funktionen "rein" sind. Wenn Sie mit diesem Begriff nicht vertraut sind, erfüllen reine Funktionen im Grunde die folgenden Bedingungen:
muss einen Wert zurückgeben. Wenn Sie sorgfältig nachdenken, wenn sie keine Parameter akzeptieren, haben sie keine Daten zu verwenden, und wenn sie keine Werte zurückgeben, was ist der Sinn der Funktion? reine Funktionen scheinen zu Beginn nicht völlig notwendig zu sein, aber die Verwendung unreiner Funktionen verursacht allgemeine Änderungen im Programm, was zu schwerwiegenden logischen Fehlern führt! Beispiel:
In unreinen Funktionen hängt die
-Funktion von der veränderlichen Variablen
ab. Wenn beispielsweise die Variable<code class="language-javascript">// 不纯 let minimum = 21; const checkAge = (age) => age >= minimum; // 纯 const checkAge = (age) => { const minimum = 21; return age >= minimum; };</code>später im Programm aktualisiert wird, kann die Funktion
einen Booleschen mit derselben Eingabe zurückgeben. checkAge
minimum
Angenommen, wir führen den folgenden Code aus: minimum
checkAge
später im Code den Wert von
bis 18 aktualisiert.<code class="language-javascript">checkAge(20); // false</code>
Angenommen, wir führen den folgenden Code aus:
<code class="language-javascript">// 不纯 let minimum = 21; const checkAge = (age) => age >= minimum; // 纯 const checkAge = (age) => { const minimum = 21; return age >= minimum; };</code>
Die Funktion checkAge
wird nun auf verschiedene Werte bewertet, obwohl dieselbe Eingabe angegeben ist.
reine Funktionen erleichtern Ihren Code den Port, da sie nicht von einem anderen Wert abhängen, der als Parameter angegeben ist. Die Tatsache, dass sich der Rückgabewert nie ändert, erleichtert die Testen reine Funktionen.
reine Funktionen schreiben konsequent auch die Möglichkeit von Mutationen und Nebenwirkungen.
Mutationen sind eine große rote Fahne in der funktionalen Programmierung. Wenn Sie mehr erfahren möchten, können Sie im Handbuch zur variablen Zuordnung und Mutation in JavaScript darüber lesen.
Um Ihre Funktion zu erleichtern, stellen Sie sicher, dass Ihre Funktion immer rein ist.
Regel 2: Halten Sie die Variable unverändert
Variablen deklarieren ist eines der ersten Dinge, die ein Programmierer lernt. Es wird trivial, ist aber äußerst wichtig, wenn funktionale Programmierstile verwendet werden.
Eines der wichtigsten Prinzipien der funktionalen Programmierung ist, dass nach der Festlegung einer Variablen im gesamten Programm dieser Zustand bleibt.
Dies ist das einfachste Beispiel dafür, wie Neuzuweisung/Neuanschlüsse von Variablen in Ihrem Code eine Katastrophe sein kann:
<code class="language-javascript">checkAge(20); // false</code>
Wenn Sie sorgfältig darüber nachdenken, können die Werte von n
nicht sowohl 10 als auch 11 sein;
Eine gemeinsame Codierungspraxis bei der imperativen Programmierung besteht darin, den folgenden Code zu verwenden, um den Wert zu erhöhen:
<code class="language-javascript">checkAge(20); // true</code>
In der Mathematik ist die Aussage x = x 1
unlogisch, da Sie x
von beiden Seiten subtrahieren, Sie erhalten 0 = 1
, was offensichtlich falsch ist.
In Haskell können Sie daher nicht einem Wert eine Variable zuweisen und sie dann einem anderen Wert neu zuweisen. Um dies in JavaScript zu erreichen, sollten Sie die Regeln befolgen, die immer const
verwenden, um Variablen zu deklarieren.
Regel 3: Verwenden Sie die Pfeilfunktion
In der Mathematik ist das Konzept einer Funktion das Konzept der Zuordnung eines Wertesatzes auf einen anderen. Die folgende Abbildung zeigt eine Funktion, die den Wert links auf den Wert rechts durch das Quadrat darstellt:
Auf diese Weise schreiben Sie es mit Arrow Notation in Mathematik: F: X → X². Dies bedeutet, dass die Funktion f den Wert x auf x² ordnet.
Wir können diese Funktion mit der Pfeilfunktion auf die gleiche Weise auf die gleiche Weise schreiben:
<code class="language-javascript">const n = 10; n = 11; // TypeError: "Attempted to assign to readonly property."</code>
Eine Schlüsselfunktion für die Verwendung des funktionalen Stils in JavaScript ist die Verwendung von Pfeilfunktionen und nicht die reguläre Funktionen. Dies ist natürlich auf Stil zurückzuführen, und die Verwendung von Pfeilfunktionen anstelle von regulären Funktionen wirkt sich nicht wirklich auf den Grad der "funktionellen" Code aus.
Eines der schwierigsten Dinge, an die man sich bei der Verwendung funktionaler Programmierstile anpassen kann, ist die Art, jede Funktion als Mapping -Eingabe für die Ausgabe zu überlegen. Es gibt keinen sogenannten Prozess. Wir haben festgestellt, dass die Verwendung von Pfeilfunktionen uns helfen kann, den Funktionsprozess besser zu verstehen.
Die Pfeilfunktion hat einen impliziten Rückgabewert, der dazu beiträgt, diese Karte zu visualisieren.
Die Strukturen der Pfeilfunktionen - insbesondere ihre impliziten Rückgabebereich - fördern das Schreiben von reinen Funktionen, da ihre Struktur tatsächlich "Eingabe für die Ausgabe zugeordnet" ist:
<code class="language-javascript">// 不纯 let minimum = 21; const checkAge = (age) => age >= minimum; // 纯 const checkAge = (age) => { const minimum = 21; return age >= minimum; };</code>
Eine andere Sache, die wir gerne betonen, insbesondere beim Schreiben von Pfeilfunktionen, ist die Verwendung von ternären Operatoren. Wenn Sie mit ternären Operatoren nicht vertraut sind, sind es inline if...else
Anweisungen in Form condition ? value if true : value if false
.
Sie können mehr über sie in schnellen Tipps lesen: So verwenden Sie dreigliedrige Operatoren in JavaScript.
Einer der Hauptgründe für die Verwendung ternärer Operatoren in der funktionellen Programmierung ist die Notwendigkeit von else
-Antals. Das Programm muss wissen, was zu tun ist, wenn die ursprünglichen Bedingungen nicht erfüllt sind. Zum Beispiel erzwingt Haskell eine -Anweisung, und wenn keine else
Anweisung gegeben wird, gibt sie einen Fehler zurück. else
Anweisungen, mit denen Operationen durchgeführt werden können, die möglicherweise Nebenwirkungen haben können. Dies ist besonders für Pfeilfunktionen nützlich, da Sie sicherstellen können, dass der Rückgabewert vorliegt und die Bildeingabe für die Ausgabemkarte aufbewahrt. Wenn Sie sich über die Nuance zwischen Aussagen und Ausdrücken nicht sicher sind, lohnt sich ein Leitfaden zu Aussagen und Ausdrücken. if-else
Die Funktion
<code class="language-javascript">checkAge(20); // false</code>
gibt den Wert von "Eat" oder "Schlaf" basierend auf dem Wert des action
-Parameters zurück. state
if...else
-Anweisung durch den ternären Operator Regel 4: Löschen Sie die für Schleife
for
Angesichts der Tatsache, dass das Schreiben iterativer Code mit for
bei der Programmierung sehr häufig ist, scheint es seltsam zu sagen, dass Sie sie vermeiden möchten. Als wir zum ersten Mal feststellten, dass Haskell nicht einmal eine Art von for
-Sloop -Operationen hatte, fiel es uns schwer zu verstehen, wie einige Standardvorgänge implementiert werden können. Es gibt jedoch einige sehr gute Gründe, warum for
Loops nicht in der funktionellen Programmierung auftreten, und wir haben schnell festgestellt, dass jede Art von Iteration ohne Verwendung
for
nicht verwendet
<code class="language-javascript">checkAge(20); // true</code>
for
Wie Sie sehen können, müssen wir in der for
-Sufe selbst let
und in den Variablen, die wir in der
Wie bereits erwähnt, ist dies normalerweise eine schlechte Praxis in der funktionalen Programmierung, da alle Variablen in der funktionellen Programmierung unveränderlich sein sollten.
Wenn wir Code schreiben möchten, in dem alle Variablen unveränderlich sind, können wir Rekursion verwenden:
<code class="language-javascript">const n = 10; n = 11; // TypeError: "Attempted to assign to readonly property."</code>
Wie Sie sehen, werden keine Variablen aktualisiert.
Die Mathematiker unter uns werden offensichtlich wissen, dass all dieser Code unnötig ist, da wir nur die clevere Summierformel 0,5*n*(n 1) verwenden können. Dies ist jedoch eine großartige Möglichkeit, den Unterschied zwischen der Variabilität einer Schleife und einer Rekursion zu veranschaulichen. for
Nehmen wir zum Beispiel an, wir möchten jedem Wert im Array 1 hinzufügen. Mit der imperativen Methode und der
-Schule könnte unsere Funktion so aussehen: for
<code class="language-javascript">// 不纯 let minimum = 21; const checkAge = (age) => age >= minimum; // 纯 const checkAge = (age) => { const minimum = 21; return age >= minimum; };</code>Wir können jedoch die integrierte
-Methode von JavaScript verwenden und eine Funktion wie folgt schreiben: map
<code class="language-javascript">checkAge(20); // false</code>Wenn Sie noch nie
Funktionen gesehen haben, ist es definitiv wert der funktionalen Programmierung im JavaScript -Interesse. In unveränderlichen Array -Methoden finden Sie mehr über sie: So schreiben Sie sehr klare JavaScript -Code. map
filter
Haskell hat überhaupt keine
-Hleiben mit rekursiven und integrierten Array-Methoden höherer Ordnung. for
for
vermeiden Es ist leicht, die Bedeutung von Datentypen bei der Programmierung in Sprachen wie JavaScript zu vergessen, für die keine Typdeklarationen erforderlich sind. Die sieben in JavaScript verwendeten primitiven Datentypen sind:
Nummer
Beispiel:
Dies ist eine sehr einfache Funktion, die zwei Zahlen (x und y) miteinander hindert. Für jede Funktion, einschließlich sehr einfacher Funktionen wie dieser, erscheint es ein bisschen lächerlich, den Datentyp für das Programm zu erklären, aber dies hilft letztendlich, zu zeigen, wie die Funktion erwartet wird und wie erwartet wird, dass sie zurückkehren. Dies erleichtert den Code leichter zu debuggen, insbesondere wenn der Code komplexer wird.
<code class="language-javascript">checkAge(20); // true</code>
Typdeklaration folgt der folgenden Struktur:
Typ -Kraft kann ein großes Problem bei der Verwendung von JavaScript sein, das verschiedene Tricks aufweist, die verwendet werden können (sogarMissbrauch
), um Inkonsistenzen in Datentypen zu umgehen. Hier sind die häufigsten Tipps und wie man sie vermeidet:<code class="language-javascript">const n = 10; n = 11; // TypeError: "Attempted to assign to readonly property."</code>
Verbindung. "Hallo" 5 wird als "Hallo5" bewertet, was nicht konsistent ist. Wenn Sie Strings mit numerischen Werten verkettet möchten, sollten Sie "Hallo" -Sziel (5) schreiben.
boolesche Anweisung und 0. In JavaScript entspricht der Wert 0 in derif
<code class="language-javascript">// 不纯 let minimum = 21; const checkAge = (age) => age >= minimum; // 纯 const checkAge = (age) => { const minimum = 21; return age >= minimum; };</code>
Dies ist eine Funktion, die bewertet, ob eine Zahl eine gleichmäßige Zahl ist. Es verwendet das Symbol !
, um das Ergebnis von n % 2
auf einen Booleschen zu geben, aber das Ergebnis von n % 2
ist kein Boolescher, sondern eine Zahl (0 oder 1).
Tipps wie diese scheinbar klug und reduzieren die Menge an Code, die Sie schreiben, aber sie brechen die Typ -Konsistenzregeln der funktionalen Programmierung. Daher ist der beste Weg, um diese Funktion zu schreiben, wie folgt:
<code class="language-javascript">checkAge(20); // false</code>
Ein weiteres wichtiges Konzept besteht darin, sicherzustellen, dass alle Datenwerte im Array vom gleichen Typ sind. JavaScript erzwingt dies nicht, aber wenn es keinen gleichen Typ gibt, kann es Probleme verursachen, wenn Sie Array-Methoden höherer Ordnung verwenden möchten.
Zum Beispiel kann eine Produktfunktion, die alle Zahlen in einem Array multipliziert und das Ergebnis zurückgibt
<code class="language-javascript">checkAge(20); // true</code>Hier ist die Typdeklaration deutlich, dass die Eingabe der Funktion ein Array mit Elementen der Typnummer ist, aber nur eine Zahl zurückgibt. Die Typdeklaration zeigt deutlich die erwartete Eingabe und Ausgabe dieser Funktion. Offensichtlich funktioniert diese Funktion nicht, wenn das Array mehr als nur Zahlen enthält.
Haskell ist eine stark typisierte Sprache, während JavaScript eine schwach typisierte Sprache ist. Um Ihr JavaScript jedoch funktionaler zu gestalten, sollten Sie Deklarationskommentare schreiben, bevor Sie Ihre Funktion deklarieren, und sicherstellen, dass Typ-Zwangsverknüpfungen vermieden werden.
Wir sollten auch hier erwähnen, dass Sie sich an TypeScript wenden können, wenn Sie eine stark eingegebene Alternative zu JavaScript wünschen, die die Konsistenz von Typen für Sie durchsetzen.
Schlussfolgerung Insgesamt
Insgesamt helfen Sie mit den folgenden fünf Regeln den Funktionscode:
for
Loop .
Wir hoffen wirklich, dass diese Regeln Ihnen so viel wie möglich helfen werden! Wir beide sind große Fans der funktionalen Programmierung und wir empfehlen, dass jeder Programmierer sie verwendet.
Wenn Sie tiefer in funktionales JavaScript eintauchen möchten, empfehlen wir dringend, "den größten Teil der ausreichenden Anleitung zur funktionalen Programmierung von Professor Frisby, das kostenlos online verfügbar ist. Wenn Sie alles lernen möchten, um Haskell zu lernen, empfehlen wir, das Interactorial Tutorial von Try Haskell zu verwenden und das hervorragende Buch Learn Haskell für größere Vorteile zu lesen, das auch kostenlos online verfügbar ist.
Häufig gestellte Fragen zur funktionalen Programmierung von JavaScript
Was ist eine funktionale Programmierung in JavaScript? funktionelle Programmierung ist ein Programmierparadigma, das Berechnungen als Bewertungen mathematischer Funktionen behandelt und sich verändert, was sich zu ändern und veränderliche Daten zu ändern. In JavaScript beinhaltet es die Verwendung von Funktionen als erstklassige Bürger und die Vermeidung von Nebenwirkungen.
Was ist eine erstklassige Funktion in JavaScript? Eine erstklassige Funktion in JavaScript bedeutet, dass die Funktion als jede andere Variable behandelt wird. Den Variablen können ihnen Werte zugewiesen, als Parameter an andere Funktionen übergeben und als Werte aus anderen Funktionen zurückgegeben.
Was ist Invarianz in der funktionalen Programmierung? Invarianz bedeutet, dass nach dem Erstellen eines Objekts nicht geändert werden kann. Im Zusammenhang mit der javaScript -funktionalen Programmierung bedeutet dies, dass sie nach der Initialisierung von Variablen oder Datenstrukturen vermieden werden.
Was ist eine Funktion höherer Ordnung? Eine Funktion höherer Ordnung ist eine Funktion, die andere Funktionen als Parameter oder Rückgabefunktionen als Ergebnisse nimmt. Sie unterstützen Kombinationen von Funktionen und erleichtern das Erstellen modularer und wiederverwendbarer Code.
Gibt es eine Bibliothek/ein Framework, das die funktionale Programmierung in JavaScript erleichtert? Ja, einige Bibliotheken und Frameworks (wie Ramda und Lodash) bieten Dienstprogramme und Funktionen, die das Konzept der funktionellen JavaScript -Programmierung unterstützen. Sie können dazu beitragen, funktionale Programmierpraktiken zu vereinfachen und zu verbessern.
Das obige ist der detaillierte Inhalt von5 Möglichkeiten, Ihr JavaScript funktionaler zu gestalten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!