Der Autor des Artikels, dessen Übersetzung wir heute veröffentlichen, hat beschlossen, den Lesern sieben Empfehlungen zu JavaScript mitzuteilen. Diese Empfehlungen werden, wie der Autor hoffen möchte, dazu beitragen, zuverlässigere Programme zu schreiben.
1. Verwenden Sie die Werksfunktionen
Wenn jemand es nicht weiß, ist eine Factory-Funktion eine gewöhnliche Funktion (keine Klasse oder ein Konstruktor), die Objekte zurückgibt. Dieses einfache Konzept ermöglicht es uns, die leistungsstarken Funktionen von JavaScript zu nutzen, um leistungsstarke und zuverlässige Anwendungen zu erstellen.Es ist wichtig zu wissen, dass eine Factory-Funktion ohne Verwendung eines Schlüsselworts aufgerufen wird new. Wenn Sie sie mit diesem Schlüsselwort anrufen, hört sie auf, sich so zu verhalten, wie sie sollte.▍ Warum Werksfunktionen verwenden?
Factory-Funktionen können verwendet werden, um die Instanziierung eines Objekts zu vereinfachen, ohne an Klassen oder das Schlüsselwort binden zu müssen new.Das Wesentliche an Fabrikfunktionen ist, dass sie als die gewöhnlichsten Funktionen angesehen werden. Dies bedeutet, dass sie verwendet werden können, um Objekte, andere Funktionen und sogar Versprechen zu konstruieren. Das heißt, solche Funktionen können kombiniert und kombiniert werden, um leistungsfähigere Fabrikfunktionen zu erstellen, die wiederum auch mit anderen Funktionen oder Objekten kombiniert werden können, um noch erweiterte Fabrikfunktionen zu erstellen. Werksfunktionen eröffnen dem Programmierer unbegrenzte Möglichkeiten.In Anbetracht des oben Gesagten und der Kombination der Verwendung von Factory-Funktionen mit den empfohlenen Ansätzen zum Schreiben von Code können diese Funktionen zu leistungsstarken und praktischen Werkzeugen werden.Hier ist ein einfaches Beispiel für eine Factory-Funktion:function createFrog(name) {
const children = []
return {
addChild(frog) {
children.push(frog)
},
}
}
const mikeTheFrog = createFrog('mike')
Wenn Sie Factory-Funktionen für einige Zeit verwenden, werden Sie möglicherweise feststellen, dass Factory-Funktionen im Vergleich zu ihren Konkurrenten in Form von Konstruktorfunktionen den Grad der Wiederverwendung von Code erhöhen können. Infolgedessen muss der Programmierer weniger Code schreiben. Factory-Funktionen erleichtern das Refactoring, da sie beliebige Objekte zurückgeben und die Arbeit an der Codebasis vereinfachen können.2. Fügen Sie beim Schreiben von Konstruktorfunktionen Methoden zu ihren Prototypen hinzu
Wenn Sie erst vor kurzem begonnen haben, JavaScript zu lernen, erscheint Ihnen die Arbeit mit einem Prototypobjekt möglicherweise etwas Neues. Ganz am Anfang war es bei mir.Beachten Sie, dass diese Technik nicht für den Unterricht geeignet ist. Klassen speichern die Methoden ohne zusätzlichen Aufwand seitens des Programmierers unabhängig in ihren Prototypen.Hier ist ein Beispiel für eine Konstruktorfunktion:function Frog(name, gender) {
this.name = name
this.gender = gender
}
Frog.prototype.leap = function(feet) {
console.log(`Leaping ${feet}ft into the air`)
}
Warum ein Konstrukt verwenden, Frog.prototype.leapanstatt nur eine Methode leapin ein vom Konstruktor erstelltes Objekt zu schreiben ? Zum Beispiel so:function Frog(name, gender) {
this.name = name
this.gender = gender
this.leap = function(feet) {
console.log(`Leaping ${feet}ft into the air`)
}
}
Tatsache ist, dass, wenn eine Methode direkt an eine Konstruktoreigenschaft angehängt wird prototype, diese Instanz von allen Instanzen des vom Konstruktor erstellten Objekts gemeinsam genutzt wird.Mit anderen Worten, wenn Sie sich auf das vorherige Beispiel verlassen, das verwendet wird this.leap, stellt sich heraus, dass beim Erstellen mehrerer Instanzen des Objekts Frogjede von ihnen ihre eigene Methode hat leap. Das heißt, es werden mehrere Kopien dieser Methode erstellt. In diesem Fall weist dies auf die irrationale Verwendung von Systemressourcen hin, da in all diesen Objekten eine Kopie derselben Methode vorhanden ist, die sich überall gleich verhält. Es ist nicht erforderlich, in jeder Instanz des Objekts Kopien einer solchen Methode zu erstellen.Dies führt zu einer Verringerung der Programmleistung. Dies ist jedoch nicht schwer zu vermeiden. Es ist zu beachten, dass die Eigenschaften this.nameund this.genderin dieser Form deklariert werden sollten, da sie zu einem bestimmten Objekt gehören müssen. Wenn wir eine Analogie zu echten Fröschen ziehen, deren virtuelle Darstellung mit dem Konstruktor beschrieben wird Frog, stellt sich heraus, dass Frösche ihre eigenen Namen haben können, Frösche ein anderes Geschlecht haben. Um eindeutige Informationen über Frösche in jedem der Objekte zu speichern, ist es daher sinnvoll, die Eigenschaften der Objekte so zu deklarieren, dass sie genau auf der Ebene der Objektinstanzen verwendet werden.Hier ist ein Beispiel für die Verwendung dieser Technik im beliebten Anforderungspaket .3. Fügen Sie den zu unterscheidenden Objekten die Eigenschaft .type hinzu.
Eine Eigenschaft .type, die durch inoffizielle Vereinbarung häufig zu Objekten hinzugefügt wird, hat heutzutage eine äußerst weit verbreitete Verwendung gefunden. Wenn Sie React-Anwendungen schreiben, sind Sie möglicherweise ständig auf diese Eigenschaft gestoßen. Besonders - wenn Sie Redux verwenden .Die Verwendung dieses Ansatzes zeigt sich sehr gut im Entwicklungsprozess, da Sie unter anderem selbstdokumentierenden Code erstellen können:function createSpecies(type, name, gender) {
if (type === 'frog') {
return createFrog(name, gender)
} else if (type === 'human') {
return createHuman(name, gender)
} else if (type == undefined) {
throw new Error('Cannot create a species with an unknown type')
}
}
const myNewFrog = createSpecies('frog', 'sally', 'female')
4. Verwenden Sie TypeScript
TypeScript ist in der JavaScript-Community weit verbreitet, da diese Sprache dem Programmierer ein leistungsstarkes Tool für die sichere Arbeit mit Typen bietet und es Ihnen ermöglicht, Fehler zu identifizieren, noch bevor sie im laufenden Code erscheinen.Mit TypeScript können Sie potenzielle Fehler bereits beim Kompilieren des Codes finden, noch bevor der Code gestartet wird. Wenn im Code etwas nicht stimmt, wird beim Kompilieren eine Kompilierungsbenachrichtigung angezeigt.Die Typensicherheit und die frühzeitige Erkennung von Fehlern sind jedoch weit entfernt von einer vollständigen Liste von Gründen für die Verwendung von TypeScript in allen Situationen. Eines der großartigen Dinge an TypeScript ist, dass Sie die neuen JavaScript-Funktionen nutzen können, bevor sie überhaupt in den wichtigsten Browsern angezeigt werden. Tatsache ist, dass TypeScript-Code in JavaScript-Code kompiliert wird, der sowohl von modernen als auch von den neuesten Browsern unterstützt wird.5. Schreiben Sie Tests
Wenn Sie an einem Projekt arbeiten und diese Arbeit ernst nehmen, müssen Sie praktisch Tests schreiben. Dadurch wird der Code vorhersehbarer und weniger fehleranfällig. Dies gibt ein höheres Maß an Vertrauen in die Qualität des Codes, wenn Änderungen daran vorgenommen werden. Mit anderen Worten, wenn Sie möchten, dass Ihr Code den Test der Zeit besteht, gibt es keinen besseren Weg, Ihren Code für diesen Test vorzubereiten, als Tests zu schreiben. Je mehr Tests Sie in Ihrem Projekt haben, desto mehr Vertrauen haben Sie in den Code, wenn Sie ihn in der Produktion bereitstellen.Wenn es notwendig wäre, nur eines der wichtigsten positiven Merkmale der Tests herauszustellen, welches wäre es? Ich glaube, das ist die Tatsache, dass Tests helfen, Fehler zu finden, bevor sie in ein Arbeitsprogramm aufgenommen werden. Was für ein Programmierer möchte eine solche Gelegenheit nicht haben? Ich würde so etwas sicherlich nicht ablehnen. Deshalb schreibe ich Unit-Tests für meine Projekte.Wenn Sie gerade erst anfangen, Tests für Ihr Projekt zu erstellen, beachten Sie, dass es heute viele Tools und Frameworks zum Organisieren von Codetests gibt. Hier sind einige gute Sachen darüber.6. Schreiben Sie so einfache Funktionen wie möglich.
Wie wir alle wissen, können Sie mit JavaScript ohne Probleme riesige Funktionen erstellen, die viele Aufgaben gleichzeitig lösen.Wenn Sie neu in der Programmierung sind, kann dies für Sie positiv erscheinen. Ich werde über mich selbst sagen, dass ich mich früher großartig gefühlt habe, als ich kräftige Codeteile geschrieben habe, die das getan haben, was ich brauchte. Es war mir hauptsächlich wichtig. Ich fühlte mich sicherer, als ich sah, dass mein Code ohne Probleme funktionierte, ganz zu schweigen von der Tatsache, dass mein Selbstvertrauen durch die Tatsache gestärkt wurde, dass ich einen riesigen Block gut funktionierenden Codes schreiben konnte. Wie naiv war ich damals!Wenn Sie Code schreiben möchten, der einfach zu warten ist, Code, der einfach und nicht zu fehleranfällig ist, ist es am besten, Ihre Funktionen so einfach und klein wie möglich zu gestalten. Je einfacher die Funktion ist, desto einfacher ist es, sie isoliert von anderen Teilen des Systems zu testen.Dies ist besonders wichtig für diejenigen, die die Prinzipien der funktionalen Programmierung in ihrer Arbeit anwenden möchten. In dieser Hinsicht können wir uns an eine bekannte Anforderung für Funktionen erinnern: Eine Funktion muss nur ein Problem lösen und dieses Problem muss sehr gut gelöst werden.7. Denken Sie immer an die Bedeutung der Fehlerbehandlung, wenn Sie JSON.parse und JSON.stringify verwenden
Bei der JavaScript-Programmierung muss beim Übergeben von JSON-Daten an eine Methode JSON.parseberücksichtigt werden, dass diese Methode als erstes Argument einen korrekt ausgeführten JSON-Code erwartet. Wenn diese Methode JSON-Materialien empfängt, mit denen etwas nicht stimmt, wird ein Fehler ausgegeben.Hier besteht die Gefahr, dass durch die Übergabe eines JSON.parsefalschen JSON-Codes die Anwendung gestoppt wird. Bei der Arbeit bin ich kürzlich auf eine Situation gestoßen, in der eines unserer Webprojekte Fehler verursachte, weil eines der externen Pakete nicht JSON.parsein den Block passte try/catch. Dies endete mit einem Fehler auf der Seite, und wir konnten das Problem nicht beheben, bis der externe Paketcode behoben war. All dies geschah aufgrund der Tatsache, dass im Code während seines Betriebs ein unverarbeiteter Fehler auftrat:SyntaxError: Unexpected token } in JSON at position 107
Bei der Verarbeitung von JSON-Daten, die aus externen Quellen in die Anwendung gelangen, kann nicht gehofft werden, dass sie korrekt formatiert werden. Sie müssen immer darauf vorbereitet sein, dass sie etwas treffen können, das einen Fehler verursacht.Zusammenfassung
Wir hoffen, dass die hier gegebenen Empfehlungen zur Verbesserung der Zuverlässigkeit von JavaScript-Code für Sie hilfreich sind.Liebe Leser! Was würden Sie denen empfehlen, die besseren und zuverlässigeren JavaScript-Code schreiben möchten?