JavaScript - Objekte - Besonderheiten

1. new

Mit diesem Schlüsselwort erstellt man eine neue Instanz eines Objektes. Bei dieser Erläuterung handelt es sich dabei erst mal nur um schon in JavaScript vorgegebene. Das funktioniert zwar auch mit selbst definierten, das Thema ist aber im Moment ein wenig zu komplex für den Anfang. Besonders wichtig ist new, wenn man mehrere "Versionen" aus einem bereits vorgegebenen Objekt anlegen will. Möchte man zum Beispiel eine dynamische Bildergalerie per JavaScript aufbauen, so muss man je nach Programmierung für jedes Bild eine eigene Instanz anlegen.

blubb       = new Image();
blubb.src   = 'blubb.gif';

blubber     = new Image();
blubber.src = 'blubber.gif';

Das Problem

... ist einer der Sachen, die ich an dieser Sprache so hasse. Manchmal muss man mit new arbeiten, manchmal nicht und keine Sau weiß warum. Bei den Objekten Array (dazu gleich mehr) oder Math beziehungsweise String kann man eine Instanz auch ohne new erzeugen. Bei Date dagegen nicht. Da ist es zwingend vorgeschrieben. So funktioniert ein alert (String.fromCharCode(65, 66, 67)); ohne Probleme, während man bei alert (Date.getDate()); eine Fehlermeldung um die Ohren gehauen bekommt, weil new fehlt.

Wenn ich ganz ehrlich bin, die Feinheiten hatte ich auch noch nicht wirklich begriffen (da ich sie bisher kaum nötig hatte), aber stellt euch schon mal darauf ein. Manchmal muss man einfach zuerst eine Instanz des gewünschten Objektes mit new erstellen.

2. with

Diese Schreibweise empfiehlt sich, wenn man mehrere Aktionen auf einem Objekt ausführen möchte. Dabei kann man sich damit ein wenig Tipparbeit sparen. So besteht die Möglichkeit, ein

document.getElementById('bla').style.border    = '1px solid #f00';
document.getElementById('bla').firstChild.data = 'bla';
document.getElementById('bla').setAttribute('align', 'center');

auch anders zu schreiben. Dabei benötigt man innerhalb der Anweisung keine direkte Referenz mehr auf das Objekt, sondern kann die Methoden und Eigenschaften direkt ansteuern.

with (document.getElementById('bla')) 
{
  style.border    = '1px solid #f00';
  firstChild.data = 'bla';
  setAttribute('align', 'center');
}

3. Geklammerte Eigenschaften

Als ich das zum ersten Mal gesehen habe, ist mir fast übel geworden. Keine Ahnung, welche gequälte Seele sich das ausgedacht hat, aber das sah mir aus, als ob es direkt aus der Programmiererhölle käme. Es ist doch tatsächlich möglich, diesen Code

var bla             = document.getElementById('bla');
bla.style.border    = '1px solid #f00';
bla.firstChild.data = 'bla';

auch so zu schreiben

var bla                   = document.getElementById('bla');
bla['style']['border']    = '1px solid #f00';
bla['firstChild']['data'] = 'bla';

Nach ersten Recherchen (zu mehr habe ich mich nicht getraut ob dieser Grausamkeit) gilt dies wohl nur für Eigenschaften eines Objektes, nicht für seine Methoden. Trotzdem mein Tipp. Das ist echt krank. Ich würde niemals damit arbeiten. Aber vielleicht bin ich ja auch zu alt und konservativ dafür.

4. style

Die style-Eigenschaft benötigt man für die JavaScript-seitige Manipulation für CSS-Anweisungen. Es gibt aber einen kleinen Unterschied, denn der normale Strich (-), den man von CSS her kennt, ist in diesem Fall verboten. Stattdessen lässt man ihn weg und beginnt den zweiten Teil der Anweisung mit einem Großbuchstaben. So wird zum Beispiel aus einem background-color im JavaScript ein backgroundColor.

zurück zum vorherigen Abschnitt weiter zum nächsten Abschnitt