OOP/DOM-Scripting JavaScript - Praxistutorial 1 - Die Konstruktorfunktion

1. Die Abschnitte

2. Der Grundaufbau

Nachdem wir uns im vorherigen Kapitel einige Gedanken über den Aufbau gemacht haben (was man eigentlich immer tun sollte), legen wir jetzt mal die grundsätzlichen Dinge fest. Dabei handelt sich, grob gesagt, um drei Sachen. Die Konstruktorfunktion mit den Methoden, eine Referenzvariable in Form eines Objektes und dann die entsprechenden Event-Handler, die aber erst im nächsten Abschnitt erläutert werden. Da muss man nämlich auf ein paar Dinge achten.

3. Die "Klasse"


function animateMenue (begin, end, time)
{
  ...
}

Erläuterung

Das Prinzip kennen wir ja schon aus dem ersten Einstiegstutorial. Hierbei handelt es um eine Art von Klasse, die automatisch initialisiert wird, wenn man mit einer Referenzvariablen darauf zugreift.

Wie schon im vorherigen Abschnitt erklärt, wollen wir diesmal drei Werte als Parameter übergeben, Den Start- und Endwert für das Rutsch-Rauf-Rutsch-Runter und die zeitliche Verzögerung. Wie ihr die Variablen nennt, ist dabei völlig egal. Solange ihr keine reservierten Wörter benutzt.

Die Methoden


function animateMenue (begin, end, time)
{
  this.menue = function (id, anzahl, posi) 
  {
    ...
  }
  function handler () 
  {
    ...
  }
  function rutschRunter() 
  {
    ...
  }
  function rutschRauf () 
  {
    ...
  } 
}

Erläuterung

Um nun später die entsprechenden Werte für die einzelnen Menüs zu übergeben, erzeugen wir die privilegierte öffentliche Methode this.menue, damit wir auch außerhalb des Konstruktors darauf zugreifen können. Das hatten wir ja schon im ersten Einstiegstutorial. Die anderen drei Methoden setzen wir dagegen auf privat, damit ein versehentlicher Zugriff von außerhalb nicht möglich ist.

4. Die Referenz


var mymenue = new animateMenue(1, 31, 5);

Das mit der Referenzvariablen/Objekten kennen wir ja schon. Die drei Parameter, die an die Konstruktorfunktion übergeben werden, sind der Start- bzw. Endwert für die Animation sowie die zeitliche Verzögerung.

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