In dieser Lektion werden wir uns ansehen Überarbeitung unseres Codes und Dokumentation. Und hier gibt es gute Neuigkeiten. Wenn wir an diesem Punkt sind, könnte dies bedeuten, dass wir nah dran sind bis zum Ende dessen, was wir für Code tun müssen, oder zumindest diese Iteration durch Was müssen wir für Code tun? Einige dieser Dinge werden wahrscheinlich klingen wie gesunder Menschenverstand, aber in meiner Karriere als Berater und Programmierer Ich fand das manchmal gesunden Menschenverstand ist nicht allzu häufig. Also, wenn Sie dieses Zeug bereits kennen, dann gut für Sie. Zunächst wollen wir schauen Möglichkeiten zum Anhängen von Ereignishandlern und wir alle haben Codierungsgewohnheiten, oder? Das Problem hier mit diesen beiden Event-Handlern wollen wir zwei verschiedene Dinge tun wenn jemand auf eine bestimmte Schaltfläche klickt. Das Problem mit der Art und Weise, wie wir es gemacht haben, ist eines davon wird den anderen überschreiben Aufgrund der Art und Weise, wie wir die Ereigniszuweisung durchgeführt haben, deshalb wollen wir das wirklich vermeiden und hoffentlich kommt es nicht bis zur Refactoring-Phase, bevor wir das herausfinden. Aber wenn doch, dann ändern wir dies einfach in etwas anderes. Wenn Sie beispielsweise über jQuery verfügen, können Sie on verwenden. Wenn Sie normales JavaScript verwenden Sie können einen Ereignis-Listener hinzufügen. Dies stellt sicher, dass keine zusätzlichen Handler Überschreiben Sie nicht die vorherigen Handler, wie wir sie dort hatten. So weit, ist es gut. Wieder vielleicht eine vernünftige Art von Wissen. Das nächste ist, und ich habe manchmal die gleiche Angewohnheit, Ich gerate in eine Methode und bin mir nicht sicher, welche Dinge über ein bestimmtes Objekt in einer Methode, die ich brauchen werde. Beachten Sie also, dass ich überall Namen habe in einigen verschiedenen Konfigurationen und ich fühle mich wie ich überarbeite, was ich wirklich tun möchte ist zurückgehen und diesen Code prägnanter machen, oder zumindest weniger anfällig für meine Tippfehler Weil ich ein großer in jQuery bin einfach das zu tun und das Pfundzeichen zu vergessen und dann funktioniert mein Code nicht. Also, wenn ich das ändern sollte, Ich werde nur Variablen erstellen. Das ist also diese Dropdown-Box so kann ich einfach ausgewählten Index machen oder ich kann anheften Suchen und erhalten Sie in einer jQuery die ausgewählte Option und dann mache das Pre-Pend, wenn ich fertig bin etwas hineinstecken. Also nur ein paar schnelle Tipps auf nur sich selbst vor sich selbst zu retten. Wie wär es damit? Das nächste könnte wieder elementar erscheinen, aber was wir nicht tun wollen, ist am Ende mit einer Art separater Skriptdatei, in der wir Dump einfach eine Reihe von Funktionen dort. Normalerweise wird es unsere Utils-Datei heißen, richtig, weil wir nicht wissen, wie wir es sonst nennen sollen. Hier ist ein Tipp. Wenn Sie keinen wirklich klaren Namen haben Was Ihre Datei ist, dann haben Sie wahrscheinlich zu viel Zeug in eine Datei geschrieben. Es sind also nur ein paar hier, aber ich habe ein Addieren und Subtrahieren und ein Multiplizieren, und dann ist hier auch das Problem, Das sitzt nur da draußen im globalen Namespace Weil ich ein weiteres Add in der Datei dieses Kunden habe und wenn ich beide auf derselben Seite verwende, Jetzt habe ich einen Konflikt. So weit dies geht, eines der Dinge, die wir tun können ist das einfach in ein Modul zu setzen. Und wir könnten auch untersuchen, wie man es einfach ausdrückt auch in eine Klasse. Bei JavaScript-Modulen haben Sie jedoch die Möglichkeit nur bestimmte Funktionen zu exportieren und du legst da draußen keine Dinge ab im globalen Namespace oder zumindest ist es ein einfacheres Konstrukt um sicherzustellen, dass Sie nicht. So hatte ich all diese hier zum Beispiel, addieren, subtrahieren und multiplizieren. Und eine andere Sache, auf die ich schaue, wenn ich diese sehe, ist: Sie wissen, sie haben alle den gleichen Parametersatz. Wenn Sie diese Situation haben, was Sie vielleicht sehen möchten verwandelt dies stattdessen in ein Objekt weil wir wollen, dass unsere Parameterliste so präzise ist wie möglich, besonders die von euch das kommt aus der funktionalen Welt, Das ist sicherlich ein Problem. Also vielleicht, wenn wir all diese haben und sie stecken in einer Utensilienklasse fest mit einer Menge anderen Codes, der vielleicht nicht da sein sollte, Lass uns einfach weitermachen und das woanders hinstellen. Also habe ich eine Klasse namens Math Ops erstellt. und auch dies sind keine bahnbrechenden mathematische Operationen, Sie sind sehr einfach, aber ich versuche zu demonstrieren eher ein Punkt darüber, wie wir unsere Funktionalität erstellen können ohne es im globalen Namespace haben zu müssen. Jetzt habe ich diese Klasse namens Math Ops das braucht einen Konstruktor, Beachten Sie jedoch, dass jedes Addieren und Subtrahieren erfolgt und die Multiplikationsmethoden nehmen jetzt ein einziger Parameter namens Triple, und was ich geschaffen habe, um das zu unterstützen, ist gerecht eine andere Klasse namens Triple und es bestätigt, dass diese Dinge Zahlen sind um es zu erstellen und geht einfach voran und gibt denen ihre Werte damit ich die da drin weitergeben kann. Jetzt wollte ich auch ein wenig über Dokumentation sprechen. Jetzt werden Sie vielleicht bemerken, dass ich dort einige zusätzliche Kommentare habe mit ein paar zusätzlichen Token und was das ist, ist ein Weg um Ihren Code zu dokumentieren und es ist ein Paket namens JS doc. Sie können es an verschiedenen Orten bekommen. Der Ort, von dem ich es bekommen habe, ist NPM hier, Wenn Sie es also noch nicht haben, ist es eine einfache Sache zur Kommandozeile gehen und Durchführen einer NPM-Installation von JS doc. Sobald Sie das Paket haben, Jetzt können Sie mit dem Erstellen dieser Kommentare beginnen. Und in der Tat, wenn Sie wollen, Sie müssen das alles nicht einmal abtippen. Ich kann dieses hier zum Beispiel versuchen. Wenn ich das nur mache, dann gehen wir, der Schrägstrich und zwei Sternchen, es wird tatsächlich die Signatur der Funktion für mich lesen und bauen Sie den Anfang dieser Dokumentation auf. Was ich damit gemacht habe, ist, dass ich angegeben habe den Datentyp des Parameters und auch den Datentyp von dem, was zurückkommt. Der Rest ist nur eine Beschreibung. Und wir werden eine Seite für die Dokumentation erstellen und das wird hier auftauchen. Wir können hier also einfach beliebigen Text direkt nach irgendetwas einfügen und dies wird die HTML-Seiten erstellen, wenn wir zurückgehen in die Kommandozeile und erstellen Sie diese. Und was die Grundlagen angeht, ist param einfach, Sie können die Namen dort setzen, und wieder jede Beschreibung, die Sie wollen. Ich weiß nicht, ob ich das brauche oder nicht, aber du weißt, So ist es mit Kommentaren. Während wir es lesen, denken wir: Nun, wir wissen genau, was es ist. aber wie wir einige Zeit später zurückgehen oder wenn jemand anderes unseren Code verwendet, wahrscheinlich eine gute Idee, dies dort einzutragen. Also habe ich dies als Konstruktor bezeichnet. Es gibt Informationen zu allen Parametern. Dies wird als Beschreibung angezeigt und alles, was einen Wert zurückgibt Wir markieren als Rückgabe mit dem Typ. Nun, wenn Sie Dokumentation erstellen möchten Für verschiedene Dateien können Sie damit auch einen Link erstellen auf den von Ihnen erstellten HTML-Seiten damit die Leute von einem zum anderen navigieren können. Jetzt sind diese Klassen an diesem Punkt ziemlich eng miteinander verbunden und so auf dieser Seite möchte ich einen Link geben zur Dokumentation für Tripel und auf Tripel Ich gebe einen Link zurück zu Mathe-Operationen. Sie können also so viel davon tun, wie Sie möchten. Und wenn Sie zu Ihrer Befehlszeile zurückkehren, Wir werden JS Doc machen und dann muss ich ihm sagen, wohin er gehen soll um Dateien zum Erstellen zu bekommen, und optional kann ich auch sagen, wo die Dateien abgelegt werden sollen wenn es sie baut. Also für dieses Projekt, Ich werde es einfach tun lassen, was es tun will so weit wie es diese Dateien ablegen wird. Aber ich wollte die Dokumentation holen von allem, was hier drüben in Skripten ist. Für alles, was ich dokumentiert habe, bekomme ich eine Seite für: sonst wird es einfach ignoriert. Und das beste Ergebnis hier, da gehen wir, ist, dass ich dies tue und nur die Eingabeaufforderung zurück bekomme. Also sollte ich einen Out-Ordner haben. Da ist es. Dies ist die Standardeinstellung, die in meiner Anwendung erstellt wird und ich kann all dies durch Indexpunkt-HTML erreichen. Es gibt also die Klassen, die dokumentiert werden. Ich habe keine Beschreibung auf der Basisseite gemacht, aber es gibt Mathe-Operationen. Da ist mein Konstruktor. Es gibt jede der Methoden. Es sagt mir, wo es im Code ist und ich kann diesen Link verwenden, um zur anderen Klasse zu navigieren und Sie können sehen, dass ich nicht für alles Beschreibungen gemacht habe, aber wenn ich es tue, taucht es genau dort auf. Ein guter praktischer Weg, um Dokumentation zu machen. Es geht nur darum, ein paar Kommentare abzugeben und wir alle wissen, dass es einfacher ist, wenn Sie es tun zu dem Zeitpunkt, an dem Sie es erstellen, nicht später. Danke fürs Zuschauen. In unserer nächsten Lektion Wir werden über das Bündeln und Minimieren sprechen wenn wir bereit sind, unser Produkt zu versenden.
