Inhaltsverzeichnis
In früheren Tutorials haben wir mit Klassen gearbeitet, wodurch unsere Anwendung modularer wurde KaffeeScript als Sprache, was uns mehr Möglichkeiten eröffnet, damit zu arbeiten.Nachdem Sie diese Konzepte gemeistert haben, ist es an der Zeit, einen Schritt weiter zu gehen und unser Wissen zu nutzen, um saubereren, funktionaleren und natürlich leistungsfähigeren Code zu schreiben. Es ist an der Zeit zu lernen, wie man Power-User von . wird KaffeeScript.
Da wir nun wissen, wie man Klassen in unserer Anwendung verwendet, ist es nur eine Frage der Zeit, bis wir damit auf Probleme stoßen. Kontext. Bei einfachen Funktionen ist es recht einfach zu erkennen, welche Daten diese Funktion in ihrem Geltungsbereich hat, sie kennt globale Variablen, innerhalb der Funktion definierte Variablen und alle Variablen, die beim Erstellen der Funktion im lokalen Geltungsbereich definiert wurden.
Wenn die Methoden jedoch an Objekte gebunden sind, wird dies etwas komplizierter. Um dies zu veranschaulichen, sehen wir uns ein Beispiel an, bei dem wir dieses Problem sehen können, und dann werden wir sehen, wie KaffeeScript kann uns helfen:
class Ship Hebeanker: (doneCallback) -> console.log "Lifting Anchor." setVel: (speed) -> console.log "Setting speed to # {speed}" set sail: -> @levantarAncla @ fixVel 70Nehmen wir dann gemäß unserem Code an, dass wir sofort die Segel setzen wollen, dazu tun wir Folgendes, um unsere Funktion aufzurufen:
bot = neuer Barco bot.zarpar ()Wenn wir genau hinschauen und diesen Code auf die reale Welt übertragen, können wir feststellen, dass das Heben des Ankers nicht sofort erfolgt, wir müssen warten, bis der Anker vollständig gelichtet ist, um die Segel setzen zu können. Wir können dieses Problem lösen, indem wir a . hinzufügen Ruf zurück und fragen, ob es abgeschlossen wurde, damit wir wissen, wie lange diese Aktion dauert, und unsere Funktion aufrufen, sobald sie abgeschlossen ist.
liftAnchor: (doneCallback) -> console.log "Anker heben." falls erledigtRückruf? setTimeout doneRückruf, 1000Wie wir sehen, rufen wir den Callback nur auf, wenn er existiert. Auf diese Weise stellen wir sicher, dass dieser Vorgang abgeschlossen ist, und müssen daher unsere Funktion ändern Segel setzen:
Segel setzen: -> @levantarAncla -> @fixVel 70Nun rufen wir die Funktion auf Segel setzen Dies stellt sicher, dass wir uns nach dem Anheben des Ankers nicht bewegen, bis der Anker vollständig ausgehoben ist. Das sieht ziemlich gut aus, wir werden unseren Code kompilieren und die generierte .js-Datei in einen HTML-Code einfügen, um die Antwort der Konsole anzuzeigen:
Wie wir im Bild sehen, haben wir einen Fehler erhalten, der besagt, dass die Funktion nicht existiert. Was ist passiert? Es ist sehr einfach, JavaScript hat den Wert eingestellt Este in der Art und Weise, wie die Funktion aufgerufen wurde, seit beim Aufruf bot.zarpar der Wert Este ist mit dem Objekt verknüpft bot, also ist dies an den globalen Kontext gebunden und das ist nicht das, was wir wollen.
Wir wollen sicherstellen, dass Este ist immer mit der Instanz von . verknüpft bot im Körper des Rückrufs und wir haben Glück, denn KaffeeScript es hat eine Funktionalität für diesen Fall. Dazu deklarieren wir die Funktion mit fetter Pfeil oder dicker Pfeil, auf diese Weise hat die Funktion die Este mit dem Kontext verknüpft, in dem es deklariert wurde, sehen wir uns an, wie unser Code mit dieser Änderung aussieht:
class Ship Hebeanker: (doneCallback) -> console.log "Lifting Anchor." falls erledigtRückruf? setTimeout doneCallback, 1000 setVel: (speed) -> console.log "Setting speed to # {speed}" set sail: -> @levantarAncla => @fixVel 70 bot = new Barco bot.zarpar ()Lassen Sie uns unsere Datei kompilieren und sehen, wie KaffeeScript Achievement Bindung mit dicker Pfeilfunktion:
Was es macht KaffeeScript bevor Sie die Ruf zurück ist eine lokale Variable zu setzen _Este, die sich auf bezieht Este, denn obwohl die Ruf zurück dynamisch an den Wert gebunden ist, lädt immer noch den lokalen Kontext, in dem er deklariert wurde. Schließlich werden wir unsere generierte Datei ausführen und dann sehen, wie der Fehler behoben wurde:
Wir haben bereits gesehen, wie man das Kontextproblem in unseren Anwendungen mit löst KaffeeScript Wir werden eine ziemlich einfache, aber leistungsstarke Technik sehen, die uns hilft, Arbeit zu sparen. Es ist keine fortgeschrittene Technik, aber es ist ein logischer Weg, um unseren Code ohne großen Aufwand zu verbessern.
AuswendiglernenWas die Technik von Auswendiglernen besteht darin, Werte einer Funktion zu speichern, anstatt sie bei jedem Aufruf der Funktion neu zu berechnen. Da wir nun wissen, wie man Klassen und Objekte verwendet, können wir dieses Wissen nutzen, um sie innerhalb von . anzuwenden KaffeeScript und wenden Sie die entsprechende Technik an.
Es gibt viele Möglichkeiten, den Prozess der Auswendiglernen, für dieses Tutorial werden wir die Dinge einfach halten. Dazu prüfen wir bei Anforderung bestimmter Informationen, ob diese gespeichert sind, geben sie in diesem Fall unverzüglich zurück, andernfalls können wir sie berechnen und für die zukünftige Verwendung speichern. Diese Technik ist äußerst nützlich, wenn wir einen komplexen Algorithmus verwenden müssen, um eine Antwort zu erhalten, oder wenn wir ein langsames Netzwerk verwenden, um Informationen zu erhalten.
Schauen wir uns also den Code an, um diese Technik zu veranschaulichen:
Klasse Rocket getPath: -> @path? = @doMathComplexProcess()Um diesen Teil des Codes besser zu erklären, werden wir ihn kompilieren, um zu sehen, wie KaffeeScript baue die JavaScript dass unsere Technik uns Arbeit in unserer Entwicklung ersparen muss, schauen wir uns an, wie unser Code aussieht:
VERGRÖSSERN
Wie wir in unserem Code sehen können, wird die Berechnung der Trajektorie nur beim ersten Mal durchgeführt Anfrage und der gespeicherte Wert wird von nun an verwendet. Wir konnten auch in unserem Code sehen KaffeeScript dass wir die Hilfe des tertiären Betreibers hatten ?= die den Ausdruck auswertet, wenn der Pfad null ist, zusätzlich haben wir Hilfe durch die implizite Rückgabe der Funktionen, die das Ergebnis des Ausdrucks zurückgeben, in diesem Fall den Wert von @Flugbahn ob es zuvor gespeichert oder gerade berechnet wurde.Aber das ist noch nicht alles, was wir mit unserer neuen Technik in KaffeeScript, wir können sogar mehr als einen Wert mit einer Datenstruktur speichern, mal sehen, wie wir das machen können:
Klasse SecurityGateway hasAccess: (guard) -> @access? = {} @access [guard.plate_number]? = verifyCredentials guard.plate_numberWas dieser Teil des Codes bewirkt, ist, dass in unserem Objekt das Ergebnis für jeden Wachmann gespeichert wird, der Zugang angefordert hat. Wir brauchen nur etwas Einzigartiges, um sie in unserem Objekt identifizieren zu können, also verwenden wir das Kennzeichen für diese Aufgabe wie unser Code übersetzt wird, wenn wir ihn kompilieren:
VERGRÖSSERN
Es ist wichtig zu erwähnen, dass diese Technik nur mit Informationen verwendet werden sollte, die sich während der Ausführung unseres Programms nicht ändern. In diesem Fall empfehlen wir die Implementierung einer Lösung basierend auf Zwischenspeicher.Schließlich werden wir eine Möglichkeit sehen, Optionen an eine Funktion zu übergeben, dies ist keine spezielle Funktionalität von KaffeeScriptEs ist eher eine Konvention, die viele Merkmale der Sprache nutzt und sie in einem leicht verständlichen Muster verwendet, das in vielen Situationen, die auftreten können, genauso nützlich ist.
Wie funktioniert es?Die Idee dahinter ist einfach, es ist eine Funktion zu haben, die dies akzeptiert Optionen Objekt die assoziative Schlüssel für die Argumente dieser Funktion enthalten kann. Dadurch sind die Optionen aus dem Code, in dem sie aufgerufen werden, leicht zu verstehen, da geschweifte Klammern die einzelnen Werte kennzeichnen. Dies reduziert auch den Aufwand, die Argumente sowie deren Reihenfolge im Auge zu behalten, da die Objektschlüssel davon nicht abhängig sind und bei Nichtbedarf weggelassen werden können.
Um die . umzusetzen Optionen Objekte Zuerst verwenden wir optionale Argumente, um standardmäßig ein leeres Argument zu verwenden. Auf diese Weise können wir beim Anrufen die Optionen weglassen, falls die Werte nicht benötigt werden:
launchNave = (name, options = {}) -> return if options.drift dry take off ()Jetzt verwenden wir den tertiären Operator ?= um die Werte der Optionen einzugeben, für die wir einen speziellen Standardwert haben möchten:
launchNave = (name, options = {}) -> options.count? = 10 console.log "# {i}…" for i in [options.count… 0] return if options.drift dry take off ()Wir definieren einen letzten Wert und verwenden den Operator ? falls es an einer Stelle verwendet wird:
launchSave = (name, options = {}) -> checkFuel (options.waitComb? 100) options.count? = 10 console.log "# {i}…" für i in [options.count… 0] return if options. Trockenstart ()Schließlich nutzen wir die permissive Syntax von KaffeeScript um die Optionen ohne die Klammern an unsere Funktion zu senden, was uns einen ziemlich einfachen und natürlichen Aufruf gibt:
LaunchShip "Millennium Falcon", DryGear: true, Countdown: 15Zum Abschluss kompilieren wir unsere Datei und sehen die Ausgabe unseres Codes in JavaScript:
VERGRÖSSERN
Mit letzterem haben wir dieses Tutorial abgeschlossen, in dem wir nicht nur fortgeschrittene Verwendungsmöglichkeiten erlernen konnten KaffeeScript sondern Techniken, die uns helfen, besseren Code zu schreiben, damit wir durch ständigen Einsatz und Forschung bessere Entwickler werden können, die die besten Praktiken für die Entwicklung von Anwendungen anwenden.