Was ist der beste JavaScript-Code-Stil? Das ist vielleicht eine Frage, bei der es schwierig ist, alle zufriedenzustellen. Stellen wir also eine andere Frage: Welcher Code-Stil ist der beliebteste?

sideeffect.kr hat auf GitHub gehosteten Open-Source-Code analysiert und einige interessante Ergebnisse erzielt. Werfen wir einen Blick darauf.

ccode

Nachgestellte Kommas vs. führende Kommas

Nachgestelltes Komma:

var foo = 1,
    bar = 2,
    baz = 3;

var obj = {
    foo: 1,
    bar: 2,
    baz: 3
};

Führendes Komma:

var foo = 1
  , bar = 2
  , baz = 3;

var obj = {
    foo: 1
  , bar: 2
  , baz: 3
};

Nachgestelltes Komma: 92.345%; führendes Komma: 7.655%. (Basierend auf 1,100,251 Commits.)

Leerzeichen und Tabs

Heutzutage bevorzugen alle Leerzeichen. Die Einrückung mit Leerzeichen stellt sicher, dass verschiedene Entwickler und verschiedene Editor-Einstellungen dasselbe Ergebnis sehen.

Leerzeichen: 81.1%; Tabs: 18.9%. (Basierend auf 2,019,550 Commits.)

Ob ein Leerzeichen nach Funktionsnamen eingefügt werden soll

Kein Leerzeichen

function foo() {
  return "bar";
}

Mit Leerzeichen

function foo () {
  return "bar";
}

Kein Leerzeichen: 67.424%; mit Leerzeichen: 32.576%. (Basierend auf 1,212,488 Commits.)

Ob ein Leerzeichen zwischen Parametern und Klammern steht

Kein Leerzeichen

function fn(arg1, arg2) {
//or
if (true) {

Mit Leerzeichen

function fn( arg1, arg2 ) {
  // ...
}

if ( true ) {
  // ...
}

Kein Leerzeichen: 94.31%; mit Leerzeichen: 5.69%. (Basierend auf 1,514,971 Commits.)

Ob Leerzeichen um Doppelpunkte in Objektliteralen stehen

Leerzeichen nach dem Doppelpunkt

{
  foo: 1,
  bar: 2,
  baz: 3
}

Kein Leerzeichen nach dem Doppelpunkt

{
  foo:1,
  bar:2,
  baz:3
}

Leerzeichen vor und nach dem Doppelpunkt

{
  foo : 1,
  bar : 2,
  baz : 3
}

Leerzeichen danach: 62.955%; kein Leerzeichen: 22.891%; Leerzeichen davor und danach: 14.154%. (Basierend auf 1,300,035 Commits.)

Persönlich finde ich, dass kein Leerzeichen zu gedrängt ist und es schwer macht, Schlüssel und Werte schnell zu unterscheiden. Was Leerzeichen auf beiden Seiten betrifft, müsste man die Doppelpunkte wahrscheinlich ausrichten, damit es ordentlich aussieht. Den Statistiken zufolge sind die meisten Programmierer zu faul, Doppelpunkte auszurichten (oder vielleicht sind die IDEs oder Editoren der meisten Programmierer nicht intelligent genug?).

Bedingte Anweisungen

Mit Leerzeichen

if (true) {
  //...
}

while (true) {
  //...
}

switch (v) {
  //...
}

Kein Leerzeichen

if(true) {
  //...
}

while(true) {
  //...
}

switch(v) {
  //...
}

Mit Leerzeichen: 78.276%; kein Leerzeichen: 21.724%. (Basierend auf 1,163,316 Commits.)

Einfache Anführungszeichen, doppelte Anführungszeichen

Einfache Anführungszeichen: 56.791%; doppelte Anführungszeichen: 43.209%. (Basierend auf 1,705,910 Commits.)

Zusammenfassung

Der beliebteste Code-Stil ist also:

  • Nachgestellte Kommas
  • Einrückung mit Leerzeichen
  • Kein Leerzeichen nach Funktionsnamen
  • Kein Leerzeichen zwischen Funktionsparametern und Klammern
  • Leerzeichen nach dem Doppelpunkt in Objektliteralen, kein Leerzeichen davor
  • Leerzeichen nach Schlüsselwörtern bedingter Anweisungen

Was beliebt ist, ist nicht unbedingt gut (zum Beispiel die Grippe), aber aus Kommunikationssicht kann das Schreiben von Code in einem beliebten Stil Ihren Code für die meisten Menschen vertrauter erscheinen lassen.