Felix Riesterer: JavaScript

Beitrag lesen

Lieber ROGA,

Was genau meinst du mit "eine Art Blaupause"?

in der objektorientierten Programmierung kann man eine Art Bauplan von einem Objekt definieren, mit dem man dann viele Instanzen davon erzeugen kann.

Wie kann ich davon Instanzen machen/haben? Ich definiere das Objekt doch nur einmal, oder?

Wenn man ein Objekt nur ein einziges Mal benötigt, spricht man auch von einem singleton. Das kann man gut mit einem Objektliteral notieren. Aber man könnte auch eine Klasse definieren und dann nur eine Instanz davon erzeugen. Wenn Du Dir eine dynamische Seite für den Browser machen möchtest, wirst Du Fällen begegnen, in denen man mehrere Instanzen von einem Objekt braucht.

Würde ich das Objekt nur einmal initialisieren ohne diese Methode einzubauen, dann wären die Daten nur statisch im Objekt und somit nach einigen Minuten schon nicht mehr aktuell. Sehe ich das so richtig?

Richtig. Es braucht einen wie auch immer gearteten Mechanismus, der die Eigenschaften von PVA.Batterie neu befüllen kann, sonst verbleiben sie unverändert so, wie sie beim Erzeugen von PVA eingetragen wurden. Dieser Mechanismus kann irgendeine Funktion irgendwo sein. Um Dir aber den Begriff Methode im objektorientierten Programmieren in JavaScript beispielhaft vorzuführen, habe ich Dein Objekt um eine solche erweitert. Damit „kann“ Dein PVA-Objekt seine Batteriedaten selbst holen und in seine passenden Eigenschaften setzen.

Ich könnte das Objekt auch so bauen, dass es nur eine Methode gäbe, die aber sämtliche, sich darin befindlichen Objekte und Eigenschaften mit aktuellen Daten abfüllen würde, oder?

Selbstverständlich. Wie Du Dein Objekt bauen willst, und was es dann wie tun soll, das modellierst Du ganz nach Deinen Vorstellungen. Da Du in Deinem Anfangsbeispiel nur dieses eine Unterobjekt Batterie gezeigt hast, habe ich dafür eine passende Methode geschrieben. Aber wenn Du noch weitere Unterobjekte vorsiehst, dann sollte die Methode vielleicht nicht an PVA hängen, sondern an PVA.Batterie:

const PVA = {
  // In den geschweiftern Klammern steht das Objekt als Literal notiert.
  Batterie: {
    // das Batterie-Objekt seinerseits als Literal
    Status: null,
    LadungEntladung: null,
    // nun eine Methode, also eine Funktion, die dem Objekt Batterie „gehört“:
    loadData: function () {
      this.Status = getState('sun2000.0.collected.SOC').val;
      this.LadungEntladung = getState('sun2000.0.collected.chargeDischargePower').val;
    }
  }
};

PVA.Batterie.loadData();

Wenn man dann eine Liste von Unterobjekten hat, kann man die der Reihe nach durchgehen und prüfen, ob sie eine Methode namens loadData haben, um diese dann auszuführen:

Object.keys(PVA).forEach(eigenschaftsname => {
  if ("function" == typeof PVA[eigenschaftsname].loadData) {
    PVA[eigenschaftsname].loadData();
  }
});

Diese Funktionalität sollte vielleicht das PVA-Objekt selbst als Methode haben:

const PVA = {
  // In den geschweiftern Klammern steht das Objekt als Literal notiert.
  Batterie: {
    // das Batterie-Objekt seinerseits als Literal
    Status: null,
    LadungEntladung: null,
    // nun eine Methode, also eine Funktion, die dem Objekt Batterie „gehört“:
    loadData: function () {
      this.Status = getState('sun2000.0.collected.SOC').val;
      this.LadungEntladung = getState('sun2000.0.collected.chargeDischargePower').val;
    }
  },
  QuatschMitSosse: {
    Geschmack: null,
    Farbe: null,
    Sinn: null,
    loadData: function () {
      console.log("Was genau kommt da woher ...?");
    }
  },
  // Methode zum Aktualisieren der Daten in den Unterobjekten
  update: function () {
    Object.keys(this).forEach(name => {
      if ("function" == typeof this[name].loadData) {
        this[name].loadData();
      }
    });
  }
};

PVA.update();

Spätestens jetzt wird die Sache unübersichtlich. Jetzt kommt Rolfs Idee mit dem Aufbauen des Objektes Stück-für-Stück zum Tragen. Man kann nun das Batterie-Objekt, sowie das QuatschMitSosse-Objekt in eigenen Programmteilen bauen, damit deren Funktionalität individuell abgebildet werden kann. Dann hat man kein solches Monster an Objekt-Literal, sondern mehrere kleinere.

Mir ist klar, dass ich Dich gerade mit vielen Details überfrachte, darunter z.B. das magische Schlüsselwort this, oder die Verwendung der Object-Klasse und deren keys-Methode, dazu das Iterieren über Elemente eines Arrays (keys gibt ein solches zurück) mittels der Array-Methode forEach. Und dann natürlich noch das Übergeben einer Funktion als Argument in einem Funktionsaufruf, dazu noch als Pfeilfunktion... aber Du kannst Dir das ja in Ruhe alles der Reihe nach anschauen.

Liebe Grüße

Felix Riesterer