Muss ich dem JS-Code Semikolons hinzufügen?

Semikolons in JavaScript trennen Communities. Manche Leute bevorzugen ohnehin die Verwendung von Semikolons. Andere ziehen es vor, kein Semikolon hinzuzufügen.

Im Herbst 2017, nachdem ich jahrelang Semikolons verwendet hatte, beschloss ich, bei Bedarf auf Semikolons zu verzichten, und richtete Prettier so ein, dass Semikolons automatisch aus meinem Code entfernt wurden, sofern die erforderliche Codestruktur dies nicht erforderte.

Jetzt finde ich, dass der Verzicht auf Semikolons sehr natürlich ist. Ich finde, dass solche Codes besser aussehen, prägnanter und lesbarer sind.

Dies ist durchaus möglich, da JavaScript nicht unbedingt Semikolons erfordert. Wenn irgendwo ein Semikolon benötigt wird, wird es im Hintergrund eingefügt.

Dieser Vorgang wird als automatisches Einfügen von Semikolons bezeichnet.

Es ist wichtig, die Regeln für die Verwendung von Semikolons zu verstehen, um zu vermeiden, dass fehlerhafter Code geschrieben wird, der sich anders verhält als erwartet.

JavaScript-Regeln zum automatischen Hinzufügen von Semikolons

Der JavaScript-Interpreter fügt automatisch Semikolons hinzu, wenn er bei der Interpretation des Quellcodes die folgenden besonderen Umstände feststellt:

• Wenn die nächste Codezeile beginnt, unterbrechen Sie die aktuelle Codezeile (der Code kann in mehreren Zeilen geschrieben werden)

• Wenn die nächste Zeile mit } beginnt, schließen Sie der aktuelle Block

• Wenn das Ende des Quellcodes erreicht ist

• Wenn sich die Return-Anweisung in der aktuellen Zeile befindet

• Wenn sich die break-Anweisung in der aktuellen Zeile befindet

• Wenn throw in der aktuellen Zeile deklariert wird

• Wenn fortgefahren wird wird in der aktuellen Zeile

mit Ihren Codebeispielen deklariert

Denken Sie anders über diese Regeln, hier sind einige Beispiele.

Sehen Sie sich das Beispiel an:

const hey = 'hey'
const you = 'hey'
const heyYou = hey + ' ' + you
['h', 'e', 'y'].forEach((letter) => console.log(letter))

Sie erhalten die Fehlermeldung Uncaught TypeError: Cannot read property 'forEach' of undefined, da JavaScript basierend auf Regel 1 versuchen wird, den Code als

const hey = 'hey';
const you = 'hey';
const heyYou = hey + ' ' + you['h', 'e', 'y'].forEach((letter) => console.log(letter))

Dieser Code:

(1 + 2).toString()

wird als „3“ ausgegeben.

const a = 1
const b = 2
const c = a + b
(a + b).toString()

löst stattdessen einen TypeError aus: b ist keine Funktionsausnahme, da JavaScript versucht, ihn als

const a = 1
const b = 2
const c = a + b(a + b).toString()

zu interpretieren

Ein weiteres Beispiel basierend auf Regel 4:

(() => {
  return
  {
    color: 'white'
  }
})()

Sie erwarten, dass der Rückgabewert dieser sofort aufgerufenen Funktion ein Objekt ist, das eine Farbeigenschaft enthält, aber das ist nicht der Fall. Stattdessen ist es undefiniert, da JavaScript nach der Rückgabe ein Semikolon einfügt.

Stattdessen sollten Sie die linke Klammer nach Return einfügen:

(() => {
  return {
    color: 'white'
  }
})()

Sie denken, dass dieser Code „0“ anzeigen wird:

1 + 1
-1 + 1 === 0 ? alert(0) : alert(2)

Stattdessen wird 2 angezeigt, weil JavaScript entsprechend zu Regel 1 wird wie folgt interpretiert:

1 + 1 -1 + 1 === 0 ? alert(0) : alert(2)

Schlussfolgerung

Vorsicht. Manche Leute haben ein Problem mit Semikolons. Es ist mir eigentlich egal, dieses Tool bietet uns die Möglichkeit, es nicht zu verwenden, sodass wir die Verwendung von Semikolons vermeiden können.

Ich schlage nichts vor, ich lasse Sie nur Ihre eigene Entscheidung treffen.

Wir müssen nur beachten, dass diese grundlegenden Szenarios in den meisten Fällen nie in Ihrem Code auftauchen.

Extrahieren Sie einige Regeln wie folgt:

• Verwenden Sie Rückgabeanweisungen sorgfältig. Wenn Sie etwas zurückgeben, fügen Sie es in dieselbe Zeile wie den zurückgegebenen Inhalt ein (ähnlich wie „Unterbrechen“, „Wurf“, „Fortfahren“)

• Beginnen Sie niemals eine Zeile mit Klammern, diese können mit der vorherigen Zeile verkettet werden um einen Funktionsaufruf oder eine Array-Elementreferenz zu bilden

Testen Sie abschließend immer Ihren Code, um sicherzustellen, dass er das tut, was Sie brauchen.

Empfohlenes Tutorial: „

JS-Tutorial“

Das obige ist der detaillierte Inhalt vonMuss ich dem JS-Code Semikolons hinzufügen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!