56 Stimmen

Welche Anti-Patterns gibt es für JavaScript?

Ich finde, dass es schwieriger zu lernen ist, was man nicht tun sollte, als was man tun sollte.

Meiner Erfahrung nach unterscheidet sich ein Experte von einem Fortgeschrittenen durch die Fähigkeit, zwischen verschiedenen, scheinbar gleichwertigen Möglichkeiten, dieselbe Sache zu tun, zu wählen.

Also, wenn es um JavaScript geht welche Dinge Sie nicht tun sollten und warum ?

Ich kann viele davon für Java finden, aber da der typische Kontext von JavaScript (in einem Browser) ganz anders ist als der von Java, bin ich gespannt, was dabei herauskommt.

7 Stimmen

Das Wenige, was ich darüber gesehen habe, zeigt, dass die ganze Sprache ein Anti-Muster ist. Ich bin immer wieder erstaunt, dass Sun nicht wegen der Verschmutzung der Marke "Java" geklagt hat.

5 Stimmen

@Paul: wirklich? Was gilt weithin als die beste verfügbare Skriptsprache? Sie ist dynamisch, erweiterbar, hat erstklassige Funktionen und die beste Closure-Implementierung, die ich kenne. Du trollst dich :/

1 Stimmen

Nein, das ist kein Trolling. Es sieht für mich unordentlich und undiszipliniert aus. Der einzige Grund, warum sie "als die beste verfügbare Skriptsprache" gilt, ist, dass sie die einzige Skriptsprache ist, die in jedem Browser ohne die Installation von Plugins verfügbar ist.

50voto

annakata Punkte 72408

Sprache:

  • Verschmutzung des Namensraums durch Schaffung eines großen Fußabdrucks von Variablen im globalen Kontext.

  • Binden von Event-Handlern in der Form 'foo.onclick = myFunc' (nicht erweiterbar, sollte attachEvent/addEventListener verwenden).

  • Verwendung von eval in fast jedem Nicht-JSON-Kontext

  • Fast jede Verwendung von document.write (Verwendung der DOM-Methoden wie document.createElement)

  • Prototyping gegen das Objekt Objekt (BOOM!)

  • Ein kleines dies, aber tun eine große Anzahl von String-Konkaten mit '+' (Erstellen eines Arrays und verbinden es ist viel effizienter)

  • Unter Bezugnahme auf die nicht existierende undefined Konstante

Entwurf/Einführung:

  • (Im Allgemeinen) keine Noscript-Unterstützung.

  • Ihren Code nicht in eine einzige Ressource packen

  • Inline-Skripte (d. h. Body-Skripte) am Anfang des Bodys platzieren (sie blockieren das Laden)

Ajax-spezifisch:

  • keine Anzeige des Beginns, des Endes oder des Fehlers einer Anfrage an den Benutzer

  • Abfrage

  • Übergabe und Parsing von XML anstelle von JSON oder HTML (wo dies angebracht ist)

Viele davon wurden dem Buch Learning JavaScript Design von Addy Osmati entnommen: https://www.oreilly.com/library/view/learning-javascript-design/9781449334840/ch06.html

edit: Mir fallen immer mehr ein!

0 Stimmen

Zum letzten Punkt in AJAX: Das X steht für XML. Wenn Sie kein XML übergeben, machen Sie nicht einmal AJAX, sondern AJAJSON oder vielleicht nur AJAJ. Ich bin mir nicht sicher, was der Unterschied zwischen der Übergabe von JSON und der Übergabe von XML ist.

3 Stimmen

Ja, ich weiß, wofür das X steht :) Meistens ist auch das A falsch. Es ist nur ein unglücklicher Oberbegriff für Sachen, die viele von uns schon vor Jahren gemacht haben. FYI der Unterschied zwischen JSON und XML ist groß, aber kritisch JSON ist leichter und ist in einem nativen Format JS braucht nicht zu parsen.

0 Stimmen

AJAX wird jetzt als Oberbegriff verwendet, wie DHTML. Obwohl Sie streng genommen recht haben. Alles, was eine asynchrone Kommunikation mit dem Server ermöglicht, ist in meinen Augen AJAX.

20voto

Kenan Banks Punkte 196831

Neben den bereits erwähnten...

  • Die Verwendung des for..in Konstrukt zur Iteration über Arrays
    (iteriert über Array-Methoden UND Indizes)

  • Javascript inline verwenden wie <body onload="doThis();">
    (unflexibel und verhindert mehrere Ereignis-Listener)

  • Verwendung des 'Function()-Konstruktors
    (schlecht aus den gleichen Gründen eval() ist schlecht)

  • Übergabe von Zeichenketten anstelle von Funktionen an setTimeout ou setInterval
    (verwendet auch eval() intern)

  • Verlassen auf implizite Aussagen durch Verzicht auf Semikolons
    (eine schlechte Angewohnheit, die zu unerwartetem Verhalten führen kann)

  • Mit /* .. */ um Codezeilen auszublenden
    (kann mit Regex-Literalen interferieren, z.B.: /* /.*/ */ )

    <Evangelismus> Und natürlich, nicht mit Prototype ;) </evangelism>

0 Stimmen

Weiß jemand, warum ich herabgestuft wurde? Ich bin neu und bin mir nicht sicher, ob ich irgendeine Regel gebrochen habe...

0 Stimmen

Ich weiß es nicht. Ich habe Sie hochgestimmt. Ich mag die meisten Ihrer Antworten.

0 Stimmen

Wahrscheinlich, weil Sie Prototype anstelle von jQuery verwenden... es scheint, wie die SO Menge ist sehr jQuery voreingenommen?

14voto

Rakesh Pai Punkte 25459

Das größte Problem für mich ist, dass ich die Programmiersprache JavaScript selbst nicht verstehe.

  • Übermäßige Verwendung von Objekthierarchien und Aufbau sehr tiefer Vererbungsketten. Shallow Hierarchien funktionieren gut in den meisten Fällen in JS.
  • Sie verstehen die prototypische Objektorientierung nicht und bauen stattdessen riesige Mengen an Gerüsten, damit sich JS wie traditionelle OO-Sprachen verhält.
  • Unnötige Verwendung von OO-Paradigmen, wenn prozedurale/funktionale Programmierung prägnanter und effizienter sein könnte.

Dann gibt es noch solche für die Browser-Laufzeit:

  • Keine Verwendung von bewährten Ereignismustern wie der Ereignisdelegation oder dem Beobachtermuster (pub/sub) zur Optimierung der Ereignisbehandlung.
  • Häufige DOM-Updates (wie .appendChild in einer Schleife), wenn die DOM-Knoten im Speicher und in einem Rutsch angehängt werden können. (RIESIGER Leistungsvorteil).
  • Übermäßige Verwendung von Bibliotheken zur Auswahl von Knoten mit komplexen Selektoren, wenn native Methoden verwendet werden können (getElementById, getElementByTagName usw.). Dies ist heutzutage immer weniger ein Problem, aber es ist erwähnenswert.
  • Erweitern von DOM-Objekten, wenn Sie erwarten, dass Skripte von Drittanbietern auf der gleichen Seite stehen wie Ihre eigenen (Sie werden am Ende den Code des jeweils anderen durcheinanderbringen).

Und schließlich die Fragen der Bereitstellung.

  • Ihre Dateien nicht minifizieren.
  • Webserver-Konfigurationen - Ihre Dateien werden nicht gzipped, nicht vernünftig zwischengespeichert.

<plug> Ich habe ein paar Tipps zur clientseitigen Optimierung die einige der oben genannten Themen und mehr in meinem Blog behandeln.</plug>

9voto

Jason S Punkte 178087
  • Browser-Erkennung (anstatt zu testen, ob die spezifischen Methoden/Felder, die Sie verwenden möchten, existieren)
  • in den meisten Fällen mit alert()

siehe auch Crockford's "Javascript: Die guten Seiten" für verschiedene andere Dinge, die man vermeiden sollte. ( bearbeiten: Warnung: Einige seiner Vorschläge sind etwas streng, wie z. B. die Verwendung von "===" anstelle von "==", also nehmen Sie sie mit dem nötigen Augenmaß.)

0 Stimmen

Außerdem bin ich mit einigen Aussagen von Crockford nicht einverstanden (z. B. mit seiner Haltung zu "with and continue").

0 Stimmen

Die Ausnahme bei der Browsererkennung ist, wenn der Browser meldet, dass er eine Methode oder Eigenschaft unterstützt, Sie aber wissen, dass die Implementierung falsch/fehlerhaft ist. Der IE unterstützt elem.setAttribute(name,value), aber er unterstützt es sicher nicht richtig.

0 Stimmen

@annakata: Guter Punkt, das tue ich auch

8voto

Vilx- Punkte 100739

Ein paar Dinge, die mir gerade durch den Kopf gehen. Ich werde diese Liste bearbeiten, wenn mir mehr einfällt.

  • Verschmutzen Sie den globalen Namensraum nicht. Organisieren Sie die Dinge stattdessen in Objekten;
  • Lassen Sie 'var' bei Variablen nicht weg. Das verschmutzt den globalen Namensraum und könnte Sie in Schwierigkeiten mit anderen Skripten dieser Art bringen.

0 Stimmen

Beachten Sie, dass jslint ( jslint.com ) gibt für beides eine Warnung aus, so dass es hilfreich sein kann, wenn man z.B. 'var' vergessen hat und versehentlich eine globale Variable erstellt.

0 Stimmen

Beachten Sie, dass Javascript keine Klassen hat. Aber ich nahm an, Sie meinten Funktionsumfang oder Objekteigenschaften/Methoden.

0 Stimmen

@thomasrutter - pardon, korrigiert :)

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X