Häufige Fehler bei Javascripts

Durch diverse Fragen im Forum dachte ich mir, dass man mal ein paar Stolperfallen bei Javascripts erläutern könnte.

Bei der Erstellung von Javascripts macht man häufig Fehler, die sich dann darin äußern, dass das Javascript nicht wie gewünscht funktioniert. Ein paar der Fehlerursachen und der dazugehörigen Lösungen möchte ich mal erläutern.

 

1. Semikolon vergessen

Obwohl es bei Javascript nicht immer unbedingt erforderlich ist, seine Befehle am Ende einer Zeile mit einem Semikolon abzuschließen, möchte ich dies trotzdem unbedingt empfehlen. Gerade wenn man mehrere Zeilen in einer zusammenfasst und diverse Aufrufe und Anweisungen hintereinander schreibt, ist es unbedingt nötig, das Semikolon zu setzen.

 

2. Code falsch geklammert

Zu den wohl häufigsten Ursachen, wenn ein Javascript nicht richtig funktioniert, gehören falsche Klammerungen. Das kann bei Funktionen passieren, oder bei ganz einfachen if-else-Zweigen oder Schleifen. Um diese Fehlerursache weitgehend ausschließen zu können, empfiehlt es sich, den Code entsprechend einzurücken. Gerade bei umfangreichen Funktionen ist das unerlässlich. Ein kleines Beispiel dazu:

nicht empfehlenswert:

a=7;for ( i = 0; i < 10; i++ ) {if ( a != i ) {document.write('ungleich');}}&#91;/source&#93;

besser:

&#91;source language='javascript'&#93;a = 7;
for ( i = 0; i < 10; i++ ) {
	if ( a == i ) {
		document.write('gleicher wert von a und i');
		break;
	}
}&#91;/source&#93;

Das häufig (aus Faulheit) genutzte Argument: "bei nur einer folgenden Befehlszeile brauche ich ja keine geschweiften Klammern" ist zwar grundsätzlich richtig, sorgt aber bei späteren Erweiterungen des Javascripts auch häufig mit dafür, dass es zu Fehlern kommt. Empfehlung daher: immer(!) geschweifte Klammern nutzen wo sie hingehören, auch wenn es nur eine nachfolgende Zeile gibt.
<p>&nbsp;</p>
<strong>3. Unerlaubte oder nicht definierte Methoden zu Objekten aufrufen</strong>

Bei Javascript gibt es viele vordefinierte Objekte (z. B. <em>window</em>), zu denen es viele native Methoden gibt. Allerdings sollte man genau schauen, welche Methoden für welche Objekte gelten.

Eine gute Referenz für diese Objekte und Methoden gibt es bei <a href="http://de.selfhtml.org/javascript/objekte/index.htm" target="_blank">SelfHTML</a>.
<p>&nbsp;</p>
<strong>4. Falsch oder nicht escapen</strong>

Sobald man Variablen bestimmte Strings zuweisen will oder die Strings einfach nur ausgeben will, muss man Sonderzeichen <em>escapen</em>. Das heißt, dass Sonderzeichen ein Backslash vorangestellt wird. Dazu gehören z. B. Zeilenumbrüche, Tabulatoren und auch Hochkommas. Da die Stringzuweisung oder -ausgabe immer in Hochkommas gesetzt werden muss, müssen die verwendeten Hochkommas - sofern sie auch innerhalb des Strings vorkommen - mit einem Backslash escaped werden.

Ein kleines Beispiel dazu:

falsch:

document.write('Was gibt's heut zu essen?');

richtig:

document.write('Was gibt's heut zu essen?');

Bei dem falschen Beispiel sieht man schon beim Syntax-Highlighting, dass da etwas faul ist. Editoren mit Syntax-Highlighting empfehlen sich daher unbedingt!

 

5. Aufruf von nicht bekannten oder nicht existenten Funktionen

Wenn Funktionen aufgerufen, d. h. genutzt werden, müssen diese vor dem Aufruf bekannt sein. Wird z. B. am Anfang einer Seite eine Javascript-Funktion aufgerufen, die erst am Ende der Seite definiert ist, so wird es an dieser Stelle zu einem Fehler oder Abbruch kommen.

Empfehlenswert ist es entweder, benötigte Funktionen in den <head>-Bereich einer HTML-Datei auszulagern, oder Javascript-Funktionen erst nach vollständigem Laden der Seite aufzurufen.

 

Ich hoffe das bringt etwas Licht ins Dunkel und das Erstellen von eigenen Javascripts fällt etwas leichter 🙂

Posted in:

3 Kommentare

  1. Hallo,
    eine Anmerkung hätte ich noch, die auch bei dir nicht sonderlich schön gelöst ist.

    Variablen sollte man in Javascript immer mit „var“ definieren.

    z. B.: for(var i = 0; i < 10; i++)

    Ich hatte selbst mal ein Projekt, wo wir durch die „falsche“ Definition von Variablen Probleme bekamen.
    Bei Firefox (V. 2.x) werden die Variablen zu globalen Variablen, wenn das var davor fehlt, was zu ungewünschten Seiteneffekten führen kann.

Schreibe einen Kommentar