Fünf oder weniger Tipps zum Schreiben von gutem JavaScript? [geschlossen]


14

JavaScript ist offensichtlich nicht mehr wegzudenken. Ich bin jedoch noch neu darin und ich habe festgestellt, dass es schwierig ist, das Gefühl zu bekämpfen, dass es so ein Chaos zu sein scheint, und ich möchte mich jetzt nicht damit befassen. Ich verstehe andere Sprachen viel besser als JavaScript, weil ich diese Angst nicht in den Griff bekommen kann. Ich habe das Gefühl, dass ich beim Schreiben von JavaScript versuche, ein Porträt von Weimaraner Welpen zu malen.

Normalerweise hilft es mir dabei, eine Handvoll der wichtigsten Anweisungen im Auge zu behalten, die ich mir für jeden meiner Schritte selbst überlegen kann. (Meiner Meinung nach ist eine Handvoll fünf oder weniger.)

Können Sie fünf (oder weniger) JavaScript-spezifische Fragen auflisten, die ich mir für jeden Schritt, den ich beim Codieren von JavaScript vornehme, stellen sollte? Was würden sie sein?

Update: Um dies zu verdeutlichen, möchte ich nicht, dass beim Erlernen von JavaScript fünf Dinge beachtet werden. Ich bitte um fünf Fragen, um mich immer vorwärts zu fragen, die jeder immer stellen sollte. Fragen auf hoher Ebene wie: "Wiederhole ich das wahrscheinlich woanders?" oder "Ist dieser Variablen- / Funktionsname spezifisch genug (oder zu spezifisch)?" <== mit Ausnahme dieser Beispielfragen, die JavaScript nicht eigen sind. Ich suche nach Anweisungen, die JavaScript eigen sind.


3
Die formulierte Frage ermutigt zu vielen Antworten, von denen jede gleichermaßen gültig wäre. Diese Art von Fragen sind keine guten Fragen. Können Sie alles umformulieren? Ansonsten besteht eine gute Chance, geschlossen zu werden.
ChrisF

2
"Top 5-Listen" machen wir hier auf Programmers.SE nicht. Wenn Sie sich für eine Antwort auf ein bestimmtes Problem interessieren, können Sie sich gerne danach erkundigen. Andernfalls würde ich Reddits r / Programming vorschlagen, um Listen wie diese zu generieren.

Antworten:


6

Ich werde dies in zwei Teilen beantworten. Eine davon ist "Fünf oder weniger Tipps zum Erlernen des Schreibens von gutem JavaScript". Das andere ist "Fünf oder weniger Tipps zum Schreiben von gutem JavaScript".

Lernen:

  1. Fragen stellen
  2. Hör mal zu
  3. Lesen
  4. Sachen machen

Tun:

  1. Globale vermeiden (modularisieren)
  2. Machen Sie die harten Sachen außerhalb von Schleifen (DOM-Auswahl, Funktionsdeklarationen, etc.)
  3. Erfahren Sie, wie Umfang funktioniert
  4. Erfahren Sie, wann und wie Verschlüsse verwendet werden
  5. Erfahren Sie, wie objektorientiertes JS funktioniert

BEARBEITEN (Hinzufügen von Fragen zur Einhaltung des OP):

Auf welchen Bereich beziehe ich mich?

Dies sollte bei durchgesickerten Globalen, Ereignishandlern und der Verwendung von Closures hilfreich sein.

Wiederhole ich mich?

Die richtige Abstraktion und Verwendung von OO-Techniken ist wichtig. Setze sie mit Bedacht ein.

Wiederholt sich mein Code?

Es ist bemerkenswert einfach, den DOM-Zugriff in eine Schleife zu stellen oder Funktionen (anonym oder anderweitig) in einer Schleife zu erstellen. Beachten Sie, dass dieser Code wahr sein kann , dass Anwendungen setTimeoutoder setIntervalals auch traditionelle Schleifen.

Bedeutet das, was ich denke, dass es bedeutet?

Truthy- und Falsy-Werte in JS können etwas schwierig sein, insbesondere wenn nicht-strenge Vergleiche verwendet werden ( ==im Gegensatz zu ===). Dynamische Eingabe, Typenzwang und die Frage, ob Sie auf Objekte oder Literale verweisen, können ebenfalls relevant sein.


28

Erstens, wissen Sie, wie die Technologie dahinter funktioniert.

Sie müssen dies wissen, weil Sie wissen, wie es funktioniert, weil Sie auf Netzwerkprobleme stoßen oder, wie ich unzählige Male gesehen habe, die Leute überhaupt nicht verstehen können, was Server- und Client-Seite eigentlich sind. Eine der häufigsten neuen Fragen lautet: "Wie kann ich JS veranlassen, eine Variable in meinem ASP-Code zu ändern ?!"

  • Verstehen Sie Ethernet / WLAN und TCP / IP, um eine allgemeine Vorstellung davon zu haben, was los ist?
  • Wie viel HTTP kennen Sie eigentlich?
  • Bekommst du eigentlich HTML? Sicher, Sie wissen vielleicht, wie Tags funktionieren und was sie verschachteln, aber verstehen Sie tatsächlich den Doctype- und den Quirks-Modus? Verstehen Sie, dass Sie Absatzmarken nicht um ein Listenelement setzen sollten?
  • Erfinden Sie JavaScript (und erklären Sie, dass es serverseitig ausgeführt werden kann). Ecmascript, Livescript, Mocascript, Jsscript, Node ...
  • Lernen Sie die Fenster-API, die DOM-API und die XHR-API. Wenn Sie diese drei Dinge nicht kennen, haben Sie keinen geschäftlichen Schreibcode für den Browser.

Verstehen Sie, dass Ihr Code größer ist als Sie oder Ihre spezifische Situation

  • Klar, du hast etwas geschrieben, aber jeder kann es sehen. Es ist alles "Open Source". Klar, Sie können es verschleiern, minimieren, was auch immer ... Wenn ich am Ende des Tages Ihren Code sehen möchte, ist es für mich trivial, alle von Ihnen eingeführten Methoden zu vereiteln.
  • Sie müssen die Unterschiede zwischen mehreren Browsern verstehen. Richten Sie sich an die beliebtesten oder an die, die Ihre Marktdemografie hat. Beispiel: ie6 rendert keine DOM-Tabellenzellenelemente, wenn Sie anstelle der DOM-API-Methoden speziell für Tabellen appendChild verwenden. Es gibt weitere Beispiele, die Sie lernen müssen.
  • Sie müssen verstehen, wie Sie Code für all diese Probleme in Browsern schreiben, nicht in Ihrem spezifischen Browser. Sie werden schnell lernen, dass Dinge, die in einem Browser gut funktionieren, in einem anderen langsam sind. Sie müssen herausfinden, wie Browser funktionieren und warum sie sich unterscheiden.
  • Schreiben Sie aus Liebe zu Odins Bart keinen Code, mit dem ich Cross-Site-Scripting-Angriffe auf Ihren Code ausführen kann. Wenn Sie einen Ajax-Anruf in eine Zelle tätigen und so etwas tuncell.innerHTML = "<script>alert("xss")</script>" und eine Warnmeldung angezeigt wird, haben Sie es falsch gemacht.
  • Finger weg von DynamicDrive, w3Schools und Websites, die schlechte Ratschläge geben. Sie müssen Gemeinschaften finden, die gute Ratschläge geben. Hier auf Stack Overflow haben wir die Chat-Räume JavaScript und Node.JS und wir tun unser Bestes, um die Grenzen des "Besseren" immer weiter zu erweitern, da Websites wie w3s veraltete Daten behalten und sich nie darum kümmern. Sie sollten bei offiziellen Websites wie dem W3C , dem Mozilla Developer Network (MDN), bleiben . Bitten Sie um eine Begutachtung Ihres Codes. Wenn Sie das Gefühl haben, mit Ihrem Code etwas Schmerzhaftes zu tun, wenn Sie viel mit dem Ausschneiden, Einfügen und Ändern des Codes zu tun haben, sollten Sie sofort in einen Chatroom gehen und um Rat fragen, wie Sie besseren Code schreiben können.
  • Wenn Sie sich beraten lassen oder die wirklich coole Sache teilen möchten, die Sie gemacht haben ... bitte, bitte, bitte. Bitte stellen Sie sicher, dass Sie es dokumentiert haben, dass Ihre Variablennamen sinnvoll sind und dass es nicht nur einzeilig ist. Sie müssen sauberen Code schreiben. Wenn Sie einen Müllhaufen haben, haben Sie nicht nur versagt, niemand, der Ihnen helfen kann, wird es wollen . Helfen Sie uns, Ihnen zu helfen.
  • Sie möchten JavaScript schreiben - das ist cool, respektieren Sie, dass nicht jeder JavaScript unterstützt. Zwei Gründe dafür: 1) Schnelleres Internet für alle (anstatt "alle Dinge in den Griff zu bekommen", was zu einer langsameren Erfahrung führt). 2) Web ist für Benutzer von konsolenbasierten Browsern, für Benutzer, die kein Skript ausführen, und für Mobiltelefone besser zugänglich. Was ich damit sagen möchte, ist, dass Ihre Website sich in angemessener Weise verschlechtern sollte, wenn jemand kein JavaScript hat. Verwenden Sie zumindest <noscript>Tags, um ihn darauf aufmerksam zu machen.
  • Aufgrund des Prototypcharakters von JavaScript können Sie Änderungen an der tatsächlichen Funktionsweise der Sprache vornehmen. Sie sehen, JavaScript entwickelt sich weiter, wir ziehen aus "ECMA Script 3", der älteren Version von JS, und aus "ECMA Script 5" (aka, es5). Aufgrund des Prototyps können wir die es3-Sprache im Feld so einstellen, dass sie wie es5 funktioniert. Das heißt, ie6, ein 10 Jahre alter Browser erhält eine Sprachfunktion, die letztes Jahr veröffentlicht wurde. Verwenden Sie es5-Shims, wo immer Sie können, sie sind wirklich cool und Sie müssen sich darum kümmern.
  • Die westliche Welt der englischsprachigen weißen Kinder nutzt nicht das Internet. Code entsprechend. Dies bedeutet, dass Sie die Internationalisierung verstehen und Code schreiben müssen, der sich mit höheren Anforderungen befasst. Vor 10 Jahren waren weniger als 500 Millionen Menschen online, heute sind es ungefähr 2 Milliarden und in weiteren 10 Jahren? Wahrscheinlich hat jede Person auf dem Planeten Zugang zum Internet, das heißt, Sie müssen Namen unterstützen, die nicht in die reguläre Sprache passen /[a-z ']/i, aber Hindi, Arabisch, Akzente (dies ist ein Problem von kurzsichtigen Entwicklern), Chinesisch , und andere. Zeichensätze, Unicode und UTF-8 verstehen.

Du bist ein Programmierer, keine Pastafabrik. Hör auf Spaghetti zu schreiben.

  • Benennen Sie Ihre Variablen nach sinnvollen Dingen.
  • Dokumentieren Sie Ihren Code. Es ist mir egal, ob Sie JSDoc verwenden, das von Rhino unterstützt wird, oder ob Sie eine Reihe von Kritzeleien haben. Schreiben Sie eine Dokumentation, die der Person hilft, die Ihren Code verwenden wird. Schreiben Sie eine Dokumentation für jemanden, der Ihren Code verbessern oder warten möchte. Fügen Sie nützliche Kommentare ein. Kommentare wie "This fizzes the bizz"oder diejenigen, die halb englisch, halb französisch sind, sind nicht hilfreich. Beschreiben Sie, was eine Funktion tut. Beschreiben komplexer Codeabschnitte.
  • Finden Sie heraus, wie Sie die Wiederholung von Code begrenzen können. Achten Sie auf modulares Design oder Funktionsmuster. Sehen Sie, was Sie abstrahieren können. Sie sollten niemals große Codesegmente ausschneiden, einfügen oder optimieren, um dasselbe zu tun.
  • Sie müssen die DOM-API verstehen. Das DOM und die Fensterobjekte sorgen für eine Menge großartiger Dinge. Das hört sich nach viel Arbeit an, aber das liegt daran, dass es ein großes, beängstigendes Akronym ist. Viele von euch JavaScript-Ninjas schreiben gerne Code wie <a href="javascript:alert("foo")">. FFS TUN DAS NICHT. Warten Sie, bis das vollständige Dokument geladen ist. Trennen Sie Ihren JavaScript-Code vom HTML-Dokument. Dies ist die grundlegende Vorgehensweise für OOP 101. Fügen Sie JS oder CSS niemals in Ihr HTML-Dokument ein. Finden Sie heraus, wie es richtig gemacht wird, oder suchen Sie jemanden, der Ihnen zeigt, wie es geht. Nochmals Fragen stellen.
  • Das Javascript:foo("buz")ist ein Psudeo-Protokoll, es wird nicht vollständig unterstützt, und wenn Sie kein Javascript in der Zeile haben, würden Sie es gar nicht erst verwenden. Ich verspreche Ihnen von ganzem Herzen, dass es keinen Grund gibt, auf dieser Erde oder irgendwo im Universum Ihr Javascript in ein HTML-Element einzufügen. Je. Also tu es nicht. Ich werde nicht einmal mehr Leuten helfen, die das tun, es ist so schlimm.

Finde heraus, wie du Code so schreibst, dass er nicht die ganze Zeit kaputt geht.

  • Globale Variablen sind eines der größten Probleme. Finden Sie heraus, wie die funktionale Programmierung in JavaScript funktioniert. Finden Sie heraus, was Heben ist. Finden Sie heraus, wie Sie globale Variablen vermeiden können.
  • Verwenden Sie statische Code-Analyse-Tools. Diese werden Sie sofort auf all die kleinen "Hoppla" aufmerksam machen, die Sie beim Schreiben Ihres Codes gemacht haben. Irgendwo ein Semikolon vergessen? Oh, da ist es. Hast du irgendwo ein globales? Oh, da ist es. Code, der möglicherweise einige mysteriöse Fehler verursacht, wenn Sie versuchen, ihn auszuführen? OH! Da sind sie! Kein stundenlanges Herumstöbern und Anstarren in einem Haufen Code, um etwas herauszufinden, das nur ein Syntaxfehler ist. (Nun, kaum einer, vielleicht haben Sie etwas getan, das er nicht fangen kann, aber im Allgemeinen ist es großartig).
  • Gerätetest. Es gibt keinen Grund, nicht zu sein. Es gibt Tonnen von Unit-Test-Tools da draußen. Grundsätzlich lautet der Unit-Test "Here's my function" und "I want it to output Y". "Here's some test input". Und der Test lautet "Haben sie alle funktioniert?". Es gibt viele JS-Test-Frameworks, wie das beliebte QUnit. Machen Sie eine Tour durch Ihre Lieblingssuchmaschine und sehen Sie, was Sie anspricht. Aber benutze sie.
  • Quellcodeverwaltung, auch Versionskontrolle genannt. Git ist beliebt und das aus gutem Grund. So ist SVN und einige andere. Um dies sofort zu beenden, müssen Sie den Produktionscode bearbeiten. Sie müssen aufhören, Dateien umzubenennen. main_backup_20110911.js.bak.1Sie verlieren Daten, Ihr Verzeichnis wird unordentlich und Sie können nicht einfach zu einem früheren Zeitpunkt "zurückspulen". Sie können nicht sehen, was los ist, Sie können keine Code-Patches erstellen. Fangen Sie einfach an, GIT zu lernen, es sollte eine Stunde dauern und Sie werden niemals zurückkehren.
  • Peer Review. Du bist nicht so gut und ich auch nicht. Ich werde besser, wenn ich so viel wie möglich um Feedback bitte. So solltest du es auch machen.

Schreiben Sie JavaScript, das die Leute lieben

  • Finden Sie heraus, warum Ihr Code langsam ist. Verwenden Sie jspref und erstellen Sie Tests.
  • Hören Sie auf, Ereignisse an ein DOM-Element zu binden, da dies langsam ist und schwerwiegende Probleme mit dem Sprudeln von Ereignissen verursacht, die viel Zeit kosten. Forschung "Event-Delegation" in JavaScript.
  • STOPPEN Sie die Verwendung von innerHTML, um das DOM zu bearbeiten. Dies geht darauf zurück, zu lernen, was HTML ist und was das DOM ist. HTML sind Daten, die von dem Server gesendet werden, den Ihre Browser-Rendering-Engine verwendet, um eine Reihe von Programmierobjekten zu erstellen, die letztendlich ein Dokumentobjekt sind. Wenn Sie innerHTML verwenden, bitten Sie Ihren Browser, das Ganze neu zu rendern. Zum Glück haben wir wie schon vor über 10 Jahren die DOM-API erstellt, mit der Sie "Kind" oder "Textknoten erstellen" anhängen können, ohne das Ganze aktualisieren zu müssen. innHTML ist eine Schande, die Microsoft erfunden hat - wenn Sie es verwenden, verlieren Sie auch alle Privilegien, darüber zu jammern, dass der IE6 schrecklich ist, weil Sie ihm helfen, für immer im Müll zu bleiben. Lerne das DOM.
  • Es muss überall funktionieren, wo es kann. Wenn etwas nicht unterstützt wird, muss es angemessen herabgesetzt werden, damit die Erfahrung nicht schadet - Sie können Ihren Benutzern nicht einfach ins Gesicht schlagen und abstürzen.
  • Copyright und Lizenz sind wichtig. Zerreißen Sie nicht die harte Arbeit anderer. Wenn jemand sagt "nicht zum Weiterverkauf", können Sie es nicht verkaufen. Seien Sie kein Idiot, sonst hassen wir Ihren Code dafür, dass er fleißige Leute runterholt.
  • JS sind Prototypen, keine Klassen. Hör auf. Wenn Sie nicht verstehen, wie ein Prototyp funktioniert, müssen Sie dies tun. Google es. JavaScript ist nicht klassenbasiert. Versuchen Sie nicht, Klassen zu erstellen. Es funktioniert nur sehr selten. Die Leute versuchen, klassischen Code in einer Prototypensprache zu schreiben und verwenden dies als Argument dafür, warum die Sprache scheiße ist. Ich könnte das gleiche Argument dafür anführen, dass Ruby Prototypen nicht unterstützen kann. Lerne etwas Neues und höre auf, es falsch zu machen.

Konzentrieren Sie sich immer auf das Wesentliche.

  • Du liegst falsch und das ist großartig, weil du jetzt etwas weißt. Nichts ist schlimmer als jemand, der nicht zugeben will, dass er sich geirrt hat und immer wieder schlechten Code aus der Tür knallt, als wäre er ein abtrünniger Rockstar-Superheld-Ninja. Sie sind nur Narren. Geben Sie zu, dass Sie sich irren können, geben Sie zu, dass Sie sich irren könnten, und bitten Sie um Hilfe.
  • Sie brauchen nicht immer jQuery. jQuery erstellt viel langsamen Code und hilft Leuten, die JS nicht kennen, JS zu schreiben. Dies ist ein weiteres Problem, da JS nicht erfordert, dass Sie JS kennen, um JS zu schreiben. Stelle dir das vor. Wenn Sie ein paar der oben genannten Dinge verstanden haben, z. B. das Erlernen von Ereignissen, das Erlernen des DOM und das Erlernen von innerHTML, werden Sie erkennen, warum jQuery schädlich für Ihren Code sein kann. Es kann an vielen Stellen korrekt verwendet werden, aber häufig können Sie eine kleinere Bibliothek verwenden oder sogar nach Luft schnappen. den Standard JavaScript , die mit Ihrem Browser kommt , etwas zu erreichen. Sie brauchen jQuery nicht, um irgendetwas zu tun, es macht es einfacher, Code zu schreiben, der cool ist, wenn Sie lernen, aber Sie müssen anfangen, besser zu werden und mehr zu lernen - wenn Sie mehr wissen, werden Sie herausfinden, wie es geht schreiben Sie trotzdem besseren Code in jQuery.Schauen Sie sich einige andere JavaScript-Bibliotheken an und seien Sie nicht mehr so ​​aufgeschlossen.
  • Sie müssen nicht ausschneiden + einfügen + optimieren, sondern müssen keinen DRY-Code erstellen. Ich habe das bereits erwähnt, aber es ist auch hier wichtig. Sie können keinen Qualitätscode schreiben, wenn Ihre Codebasis eine Schande ist.
  • Missbrauchen Sie keine Arrays / Objektunterschiede, lernen Sie, wie man Schleifen durchführt. Erfahren Sie, warum Sie eine verwenden for (;;)und warum Sie eine for( in )Schleife verwenden. Wann wird eine while-Schleife verwendet? Stoppen Sie das Verschachteln von IFs, wenn Sie nur ein Schaltergehäuse verwenden können. Objekte behalten die Ordnung nicht bei, verwenden Sie sie also nicht als Array. alte Opera / FF, alte MISE, manchmal respektiert Flash die Reihenfolge Ihrer Objekte nicht. Verwenden Sie ein Array, wenn Sie die Reihenfolge der Dinge beibehalten möchten, und ein Objekt, wenn Sie ein Objekt (etwas, das keine Reihenfolge der Elemente hat) haben möchten.
  • Wie Entscheidungsstrukturen zu Ihrem Vorteil genutzt werden können, ohne Ihrem Code Komplexität zu verleihen. Hören Sie auf, IFs zu verschachteln, und finden Sie heraus, wie boolesche logische Operatoren funktionieren. Finden Sie heraus, wie der Schalter funktioniert.
  • RTFM. Der beste Ort, um etwas über besseren Code zu lernen, ist das Lesen der aktuellen Spezifikation. Lesen Sie die RFC-Spezifikationen zu dem Teil des Codes, den Sie verwenden möchten. Lesen Sie das ECMAScript-Dokument. Lesen Sie die W3C DOM-Spezifikation. Lesen Sie die W3C XHTML / HTML / HTML5-Spezifikation. Lesen Sie die technischen Daten, sie sind gut.

Konzentriere dich auf das lange Spiel, nicht auf einen schnellen Blitz und stirb.

  • Du solltest der Community helfen, du solltest Code schreiben, der noch lange existieren wird. Haben Sie eine Leidenschaft für Ihren Code und Ihre Community. Wenn Sie schlechtes Wissen irgendwo hinterlassen haben, gehen Sie zur Hölle zurück und beheben Sie es. Schlechte Informationen sind wirklich schwer zu bereinigen und bleiben für immer bestehen. Tue deinen Teil. Hilf w3schools nicht dabei, das Web noch schlimmer zu machen.
  • Springen Sie nicht aus dem Nichts hinein und sagen Sie "Hey, ich habe eine großartige Idee, wie man es benutzt which". Lassen Sie eine Menge Code fallen, den niemand benutzen kann und der verschwinden kann. Sie haben nichts beigetragen. Verwenden Sie keine Variablen wie aund chezburger.
  • Lernen Sie, den schlechten und den guten Code zu erkennen, finden Sie ihn in Ihrem eigenen Code und verwandeln Sie Ihren schlechten Code in guten Code.
  • Etwas erschaffen, etwas lernen, etwas lehren.
  • Deinen Horizont erweitern. Sie können nicht einfach JavaScript für immer schreiben - nehmen Sie ein Sabbatical in etwas anderes, das Sie interessiert, kehren Sie zurück, teilen Sie das Gelernte mit und sehen Sie, ob Sie einen Platz in der Community dafür finden können. Versuchen Sie der anderen Welt zu zeigen, welchen Wert JavaScript auch hat, während Sie da draußen sind.
  • Du liegst immer noch falsch, auch wenn du alles weißt. Verwenden Sie einen Beweis, um korrekt zu sein, nicht Ihren Status / Ihre Autorität. Sie können niemals Recht haben, aber Ihr Beweis ist immer richtig. Komme nicht in Streichhölzer, so schwer es manchmal zu vermeiden ist. Entweder gibt es Beweise oder nicht. Flammen helfen niemandem.

Für alle Interessierten habe ich das meiste aus persönlichen Notizen in einem Tutorial entnommen, das ich nirgends fertig geschrieben habe.


Ihre Antwort nach oben hat HTTP und HTML völlig durcheinander gebracht.
Bryan Boettcher

@ Insta Ich bin ganz bewusst mit der Aussage, dass Sie HTTP verstehen müssen. Wie ich bereits sagte, lautet eine der häufigsten neuen Fragen, die ich sehe, "Wie kann ich JS veranlassen, eine Variable in meinem ASP-Code zu ändern ?!" Ich versuche zu sagen, dass man die Ebenen kennen muss, damit sie nicht durch diese Dinge verwirrt werden. Um dies funktional auszudrücken, würde ich sagen: TCPIP(HTTP(ClientServerRelationship(), Cookies(), HTML(JavaScript(Knowledge))))
Inkognito

1
"Bekommst du eigentlich HTTP? Sicher, du weißt vielleicht, wie Tags funktionieren und was sie verschachteln, aber verstehst du eigentlich den Doctype- und den Quirks-Modus? Verstehst du, dass du keine Absatz-Tags um ein Listenelement setzen solltest?" Nichts in diesem Zitat bezieht sich auf das Transportprotokoll, außer auf den missbräuchlichen Fall.
Bryan Boettcher

1
@ insta Ah sorry, das habe ich überhaupt nicht gesehen, ich habe es in HTML geändert. Vielen Dank :).
Inkognito

1
+1 Dies ist eine weitaus bessere Antwort als die akzeptierte
Tom Squires

7
  1. Lesen Sie Douglas Crockfords Javascript: The Good Parts . Das ist ein ziemlicher Tipp, aber ehrlich gesagt, der beste Rat, den ich je zum Schreiben von gutem Javascript gehört habe.

  2. Lesen Sie dazu die Artikel von Douglas Crockford in Javascript .


9
Aber nimm es nicht religiös. Schau es dir an und stelle sicher, dass es für dich Sinn ergibt. Stellen Sie Fragen, bei denen Sie den Zweck nicht verstehen.
Inkognito

3
alert('This illustrates how JavaScript has first-class functions');
alert('It also illustrates how to use closures.  Try running this code in your browser.');

var funky = function(s) {
    alert("We're getting funky with " + s);
};

var makeFunkyObject = function(funkyFunction) {
    var numberOfTimesAlerted = 0;
    var fn = { };
    fn.alertFunky = function(s) {
        funkyFunction(s);
        numberOfTimesAlerted++;
    }
    fn.getNumberOfTimesAlerted = function() {
        return numberOfTimesAlerted;
    }
    return fn;
}

var funkyObject = makeFunkyObject(funky);

funkyObject.alertFunky('Alice'); // alerts We're getting funky with Alice
funkyObject.alertFunky('Bob'); // alerts We're getting funky with Bob
alert(funkyObject.getNumberOfTimesAlerted()); // alerts 2

alert('Also, be sure to distinguish between learning about JavaScript and learning about the DOM');
alert('The former is awesome; the latter, not so awesome.');

+1: Sobald Sie dies erreicht haben, werden Sie ein Javascript-Ninja.
Spoike

2

Hier sind einige Fragen, mit denen Sie JavaScript aktivieren können.

  1. Wie funktioniert JSON und wofür ist es gut?

  2. Warum sind Funktionsobjekte in Javascript?

  3. Warum sollte ich eval nicht benutzen?

  4. Wie erstelle ich Ereignisse in Javascript?

  5. Wie erkenne ich Features in Javascript?

Ziemlich genau deckt die meisten Dinge ab, die Sie in Javascript tun müssen.


1
  1. Verwenden Sie immer Semikolons. Implizite Semikolons (in JS) sind eine schreckliche Idee, insbesondere, wenn einige der interessanten Syntaxen im allgemeinen Sprachgebrauch schweben. Sie werden im Allgemeinen auch von jedem JS-Minifier benötigt.
  2. Vermeiden Sie eval () . Dies verursacht alle Arten von Problemen und ist eine sehr schnelle Möglichkeit, Ihre Anwendung zu verlangsamen. Die meisten Verwendungen sind tatsächlich Missbräuche. Jedes Mal, wenn Sie denken, dass Sie es verwenden müssen, eval()überprüfen Sie es doppelt und dreifach auf eine andere Weise. Es gibt fast immer einen saubereren und einfacheren Weg, es sei denn, Sie versuchen tatsächlich, eine ganze Zeichenfolge im Wert von JavaScript auszuführen.
  3. (function() {/* stuff */})()Dies ist eine gute Möglichkeit, eine Reihe von Code einzuschließen und einen lokalen Bereich dafür zu erstellen. Die Verwendung von Objekten ist ein anderer, oftmals besserer Weg. Objekte sind bei dieser Verwendung eher mit Namespaces in anderen Sprachen vergleichbar. Passen Sie einfach auf this. thisVerweist im Gegensatz zu den meisten anderen Sprachen nicht immer auf das, was Sie intuitiv für möglich halten. Denken Sie auch daran, dass, sofern nicht anders angegeben, alle JS-Variablen, -Funktionen und andere Objekte global sind, auch über mehrere.js Dateien hinweg.
  4. Finde und lerne / benutze eine gute JS-Bibliothek. jQuery ist eine der beliebtesten. Dies erledigt einen Großteil der Arbeit für Sie, einschließlich Funktionen zur Funktionserkennung und zur Beseitigung von DOM-Manipulationen sowie der vielfältigen Möglichkeiten, wie verschiedene Funktionen in verschiedenen Browsern implementiert wurden.
  5. Verwenden Sie immer Semikolons. Ernsthaft. Holen Sie sich eine IDE, die Sie warnt, wenn Sie sie vergessen. Ich möchte nicht nach Garantie klingen, aber es gab einige Male, in denen Bugs nur wegen fehlenden Semikolons eingeführt wurden und der Browser Sie nicht davor warnt.

Sie brauchen nicht immer ein Semikolon, aber ich stimme zu, dass dies eine gute Praxis ist.
Rlemon

1
Die ASI-Regeln sind in allen JS-Engines gleich, sodass sich Ihr Code an einer Stelle an einer anderen Stelle gleich verhalten sollte. Es ist schön, Semikolons an den richtigen Stellen zu sehen, aber es wird Sie wahrscheinlich nicht so töten, wie andere Probleme es tun. Davon abgesehen sollten Sie sich vor ASI hüten und Dinge tun wie returnund die nächste Zeile, die Ihre Daten enthält, haben Sie tatsächlich return ;aufgrund von ASI gesagt . Ich würde sagen, es ist wichtiger, die ASI- und Whitespace-Regeln zu verstehen, als "immer Semikolons verwenden". Aber es ist eine großartige Möglichkeit, sich selbst zu retten.
Inkognito

+1 zur Vermeidung von Auswertungen, -1 für Semikolon-Paranoia. Das Einfügen von Semikolons in JavaScript unterliegt bestimmten Regeln, deren Einhaltung sehr logisch ist.
Probieren

@Incognito +1I'd say it's more important to understand ASI and whitespace rules than it is "always use semicolons."
Rlemon

Für alle, die sagen, dass Sie nicht immer Semikolons benötigen. Kommen Sie zu uns zurück, wenn Sie die eigentliche browserübergreifende Entwicklung in Javascript durchgeführt haben (siehe IE6, 7 und 8).
Spoike

0

Ich glaube, Klassen sind ein ziemlich mächtiges Werkzeug, um Code zu strukturieren. Es gibt viele sprachunabhängige Regeln zum Entwerfen klassenbasierter Systeme, und einige OO-Prinzipien werden bei der Verwendung von Klassen tatsächlich offensichtlicher implementiert.
Deshalb schlage ich vor, dass Sie sich CoffeeScript ansehen .

Ich schlage vor, dass Sie nur versuchen, Informationen zur Implementierung von SOLID , DRY , GRASP , KISS und YAGNI zu sammeln , und vor allem, wie Sie Situationen denen sie in Konflikt zu geraten scheinen (das tun sie nie, nur Ihr Verständnis von ihnen oder das vorliegende Problem). Es ist ziemlich leicht zu finden, auch beim Stapelaustausch.

Bitte beachten Sie, dass diese Prinzipien ebenso für die "rohe" JavaScript-Entwicklung gelten. Viele Inhalte, die Sie auf ihnen finden, veranschaulichen sie jedoch in klassenbasierten Sprachen. Daher kann es hilfreich sein, in einer Sprache zu programmieren, in der das Verständnis nicht zu aufwändig ist.
Persönlich denke ich, dass JavaScript eine extrem mächtige Sprache ist, aber eigentlich muss man erst andere Sprachen verstehen, um diese Tatsache wirklich zu würdigen.


-7

Ich gehe davon aus, dass Sie JavaScript für die clientseitige Benutzeroberflächenentwicklung in einer Webanwendung verwenden.

1) Sollte dies Clientseite sein oder sollte dies Serverseite sein? Ich weiß, dass ich ernsthafte Codestücke geschrieben habe, die es wirklich verdient haben, auf dem Server zu sein und umgekehrt. Oft werde ich einen AJAX-Aufruf für etwas machen, das einfach besser in den Server-Code eingefügt wird, um auf dem Weg dorthin eingeschlossen zu werden. Vor allem Dinge, die statisch sind, sich aber regelmäßig ändern (z. B. Kategorienliste).

2) Gibt es ein Plugin, das das schon macht?Ich benutze JQuery sehr oft und die Antwort lautet fast immer JA! Ich nehme oft Plugin-Code, den jemand geschrieben hat, und passe ihn an meine Bedürfnisse an (normalerweise füge ich den Dingen zusätzliche Klassen hinzu usw.), aber selten muss ich jemals von vorne anfangen.

3) Ist Javascript der richtige Ort dafür? Gelegentlich werde ich feststellen, dass ich eine ganze Reihe dynamischer Stile zu etwas über Javascript hinzufüge, wenn es viel sinnvoller ist, intelligentes CSS zu verwenden.

4) Sollte ich ein anderes Werkzeug verwenden? Damit habe ich mich in letzter Zeit auseinandergesetzt. Es gibt einige Javascript-Alternativen wie Kaffeeskript , die in meinem Stack gut gehandhabt werden (Rails 3.1), und ich habe darüber nachgedacht, ob ich einen Großteil meines Codes dorthin verschieben soll oder nicht.

5) Ist dieser Javascript-Code ein guter Code? Javascript ist Code wie jeder andere Code. Ist dieser Code so gut wie der Rest meines Codes? Wenn nein, warum nicht? Ist es wegwerfbar? Bin ich faul


4
Ihre Tipps zum Schreiben von gutem JavaScript lauten "Schreiben Sie kein JavaScript" und "Schreiben Sie gutes JavaScript". Entschuldigung, -1
Ryan Kinal

1
@ RyanKinal Enthält "Verwenden Sie die meiste Zeit jQuery." Das allein ist ein großes Problem.
Inkognito

2
@ f0x Warum sagst du das? Warum möchten Sie nicht auf der Arbeit aufbauen, die jemand anderes geleistet hat?
Drew

2
@Ryan, Ihre Antwort auf die Frage "Nennen Sie fünf oder weniger Fragen, die ich mir stellen sollte" enthielt drei Anweisungen, die mit "lernen [so und so] ..." begannen. Fragen, die ich mir für jeden Schritt beim Codieren von JavaScript stellen sollte. Nicht "Was muss ich lernen, um JavaScript zu verstehen?" Drew ist die einzige Person, die die gestellte Frage beantwortet hat.

2
@ f0x Ich sage nicht, dass Sie ein Plugin blind verwenden sollten, unabhängig davon, ob es sinnvoll ist oder nicht, aber wir verwenden alle Tools, die uns andere zur Verfügung stellen, ansonsten würden wir alle unsere eigene Version von Assembly verwenden. Plugins bieten Ihnen einen hervorragenden Ausgangspunkt, indem Sie entweder (a) Ihr Problem direkt lösen oder (b) Ihnen einen Einblick geben, wie andere das Problem gelöst haben, das Sie zu lösen versuchen.
Drew
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.