Gnade vor dem Semikolon
Dass Javascript viele kleine Fehler verzeiht, ist nicht gerade hilfreich. Es ist besser, sich von vornherein auf ein strenges striktes Javascript einzustellen.
Wenn ein Script nicht so funktioniert wie es gedacht ist, gilt der erste Blick der Console des Browsers.
Eine Konsole mit Zugriff auf das DOM bietet heute jeder Browser. Sie wird in jedem Browser anders aufgerufen und die Fehlermeldungen können in den verschiedenen Browsern unterschiedlich ausfallen. Syntaxfehler lassen sich in der Console schnell aufspüren, aber auch bei der Analyse von Logikfehlern ist die Console das hilfreichste Werkzeug.
Groß- und Kleinschreibung
Javascript vergibt viele Fehler und ist nicht besonders strikt, aber wenn es um die Groß- und Kleinschreibung geht, kennt Javascript keine Gnade.
Javascript ist eine case-sensitive Sprache – d.h. Groß- und Kleinschreibung machen einen Unterschied. let val; ist eine andere Variable als let Val;.
Solche Fehler werden schnell übersehen: IF in Großbuchstaben wird vom Javascript-Interpreter nicht erkannt:
IF (a === b) {
...
}
führt zu einem Fehler im Programm – es muss heißen
if (a === b) {
...
}
Javascript ist Case Sensitive. Javascript ist Case Sensitive. Javascript ist Case Sensitive.
Das kann man gar nicht oft genug wiederholen: Javascript ist kleinlich bei Groß- und Kleinschreibung.
Klammern und Hochkommas
Das Fehlen einer öffnenden oder schließenden Klammer verzeiht Javascript nicht, auch nicht das Fehlen eines öffnenden oder schließenden Hochkommas.
Gegen diese Fehlerquelle hilft ein Programmeditor mit Syntax-Hightlighting, der die Schüsselwörter der Programmiersprache erkennt und farbig abhebt.
Bei den geschweiften Klammern für Anweisungsblöcke teilen sich die Meinungen: Öffnende Klammer rechts oder links?
block block {
{ …
… }
}
Wird in vielen Funktioniert
Programmiersprachen einwandfrei in
einwandfrei Javascript
funktionieren
Öffnende geschweifte Klammer immer links funktioniert in vielen Programmiersprachen problemlos und wird auch oft als Standard-Schreibweise empfohlen.
In Javascript kann eine geschweifte Klammer links zu stillen Fehlern führen.
return return {
{ ok: true
ok: false };
}
// Stiller Fehler // problemlos
Javascript setzt Semikolons automatisch – allerdings von Zeit zu Zeit an die falsche Stelle. Und hier führt das automatisch gesetzte Semikolon zu einem Fehler.
return;
{
ok: false;
};
Das Resultat ist ein leeres return. Das automatisch gesetzte Semikolon nach der schließenden geschweiften Klammer hingegen ist harmlos: Es erzeugt eine leere Anweisung.
Camel Case: Bindestriche sind Minuszeichen
Die Namen von Javascript-Variablen dürfen keinen Bindestrich enthalten, sonst gibt es einen Syntaxfehler, denn der Bindestrich wird in Javascript als Minus interpretiert. Die Programmierkonventionen für Javascript besagen darum: Zusammengesetze Variablennamen werden als Camel Case geschrieben.
Beim Camel Case entfällt der Bindestrich und das Wort nach dem Bindestrich beginnt mit einem Großbuchstaben: camelCase statt camel-case, headerTitle statt header-title.
Leerzeichen und Zeilenumbrüche
Javascript ist ziemlich unempfindlich gegenüber leeren Zeichen und Zeilenumbrüchen. So darf der Code schön arrangiert werden, damit er gut zu lesen ist.
Diese Javascript-Anweisung hier ist also korrekte Syntax
elem.innerHTML =
'Hier ist eine Anweisung über zwei Zeilen';
Aber der Zeilenumbruch innerhalb des Strings erzeugt einen Syntax-Fehler:
elem.innerHTML = 'dies ist eine Anweisung über zwei Zeilen';
[Error] SyntaxError: Unexpected EOF
In der Regel sollte eine Javascript-Anweisung in einer Zeile stehen, aber ein Zeilenumbruch macht lange Anweisungen lesbarer. Dafür gibt es heute Backticks:
elem.innerHTML = `dies ist eine Anweisung über zwei Zeilen`;Immer daran denken, dass Javascript das Semikolon am Ende einer Zeile selber einsetzt:
function foo (a, b) {
return
a + b;
}
const bar = foo(17, 200);
console.log ("bar", bar);
gibt undefined zurück, denn der Parser macht daraus
return;
a + b;
Das Semikolon nach der schließenden geschweiften Klammer
Javascript-Anweisungen werden mit einem Semikolon beendet. Bei einem Zeilenumbruch am Ende einer Anweisung versucht Javascript, das Semikolon selber einzufügen, wenn der Programmierer keines gesetzt hat.
Am Ende einer geschweiften Klammer braucht Javascript kein Semikolon.
if (a == b) {
...
};
Ein Semikolon am Ende einer geschweiften Klammer erzeugt eine zusätzliche leere Anweisung. Das ist an und für sich nichts Schlimmes und führt nicht zu einer Fehlermeldung, aber verwendet einen vollen Zyklus, um nichts zu tun.
Auch wenn das Semikolon am Ende von regulären Anweisung in Javascript weggelassen werden darf: Besser ist es, immer ein Semikolon zu setzen.
Javascript Kommentare
Kommentare in Javascript sehen aus wie Kommentare in C oder C++, Java oder PHP. Ein einzeiliger Kommentar wird durch einen doppelten Schrägstrich am Anfang der Zeile gekennzeichnet.
// Ich bin ein einzeiliger Kommentar
Ein Kommentar über mehrere Zeilen beginnt mit /* und endet mit */.
/* Ich bin ein Kommentar über mehrere Zeilen */
Literale
Ein Literal ist ein Datenwert, der wörtlich im Programm steht, z.B. die Zeichenkette (string) "Hallo Welt" oder die Zahl 42. String-Literale müssen in Hochkommas gesetzt werden und dabei muss am Anfang der Zeichenkette derselbe Typ von Hochkomma stehen wie am Ende der Zeichenkette. Hochkommas unten und oben (Smartquotes), wie sie von Texteditoren für deutsche Anführungszeichen verwendet werden, sind nicht erlaubt.
Schlüsselwort-Literale wie null oder true werden nicht in Hochkommas gesetzt.
Der Zeichensatz
Nur wenige wissen, dass Javascript-Programme im 16-Bit-Unicode-Zeichensatz geschrieben werden können. Für die englischsprachige Welt ist das selten ein Thema, aber für alle anderen heißt das, dass "palü" ein valider Name für eine Variable ist.
Das ist im Grunde genommen noch nicht einmal gar so weltbewegend … interessant ist, dass Javascript Umlaute und Sonderzeichen nicht kodieren muss, um sie in ein HTML-Dokument zu setzen.
Voraussetzung ist einfach nur, dass auch das HTML-Dokument im UTF-Zeichensatz geschrieben wird. Dazu reicht schon die Angabe des Zeichensatz per meta-Tag.
<meta charset="utf-8" /> (HTML5)
im HEAD-Element des Dokuments und ein Texteditor, der das Speichern eines Elements im UTF-Zeichensatz erlaubt. Und schon kann die umständliche Kodierung von Umlauten und Sonderzeichen unterbleiben.
"use strict";
Der Strict Mode für Javascript kam mit ECMAScript 5. Mit "use strict"; (in doppelten Hochkommas!) am Anfang eines Scripts oder in einer Funktion wird Javascript strenger und wirft mehr Exceptions. So verlangt Javascript z.B. die Vereinbarung von Variablen mit var, let oder const.
Wer einen Check seiner Scripte mit JSLint durchführt, muss "use strict"; immer voransetzen. … Und der regelmäßige Syntax-Check mit JSLint lohnt sich. Er führt nach und nach zu automatisch besserem Javascript. JSLint beschwert sich schon, wenn das übliche Einrücken in Funktionen einmal unterlassen wird oder wenn Funktionen aufgerufen werden, bevor sie definiert werden: Es geht eben nichts über schöneren Code. Natürlich muss man JSLint nicht bis ins letzte Detail folgen!
