Orlok: eval()

Beitrag lesen

Hallo Werner

myElements: function(id){
        arrElements0 = [1, 3, 4, 5, 7];
        arrElements1 = [0, 2, 3, 4, 5, 6, 7];
       
        return eval("arrElements" + id);
}   

Das Wesentliche wurde hier im Thread ja schon geklärt. Insbesondere zu eval.

Wenn du auf die Unterstützung älterer Browser verzichten kannst, gäbe es allerdings noch andere Möglichkeiten als die genannten, um Daten mit deinen Elementen zu verknüpfen.

Anstatt wenig aussagekräftige Zahlen als ID zu setzen, was leicht zu Namenskonflikten führen kann, könntest du bei der Verwendung einer Map direkt entsprechende Objektreferenzen als Schlüssel zu den Arrays verwenden.

const data = new Map;

// Get object reference
const element = document.querySelector('...');

// Create entry with reference as key
data.set(element, [1, 3, 4, 5, 7]);

// Read value with reference
const value = data.get(element);

Eine Map verwaltet eine interne Liste von Schlüssel-Wert-Paaren, wobei sowohl die Werte als auch die Schlüssel beliebige Datentypen sein können.

Anders als bei Arrays, deren Elemente über einen ganzzahligen Index angesprochen werden und anders als bei planen Objekten, deren Eigenschaftsnamen nur Strings und Symbole sein können, ist es bei Maps möglich, Objekte direkt als Schlüssel zu verwenden.

Das Hinzufügen und Lesen von Einträgen kann wie in dem Beispiel oben bewerkstelligt werden. Darüber hinaus gäbe es aber auch die Möglichkeit bei der Erzeugung der Map die Einträge in einem iterbaren Objekt wie einem Array zu übergeben, wenn das in deinem Anwendungsfall sinnvoll erschiene.

const data = new Map([
  [elementOne, [0, 1, 2, 3, 4]],
  [elementTwo, [5, 6, 7, 8, 9]]
]);

// Get stored list
const value = data.get(elementOne)

Mit den Methoden entries, keys und values könntest du Iteratoren für die Einträge, Schlüssel oder Werte der Map erzeugen, was nützlich wäre, wenn du Bedarf daran hättest auf mehreren Einträgen zu operieren.

Statt eine Map zu verwenden könnte es aber auch sinnvoll sein auf eine WeakMap zu setzen. Diese Datenstruktur ist vergleichbar mit einer Map aber speziell für die Verwendung von Objektreferenzen als Schlüssel für die Einträge ausgelegt.

const data = new WeakMap;

// Get object reference
const element = document.querySelector('...');

// Create entry with weak reference as key
data.set(element, [1, 3, 4, 5, 7]);

// Read value with reference
const value = data.get(element);

Bei einer WeakMap werden die Referenzen auf die als Schlüssel verwendeten Objekte schwach gehalten. Das bedeutet, dass wenn keine anderen Referenzen auf ein Objekt mehr bestehen, etwa weil es aus dem DOM entfernt wurde und auch sonst nichts mehr auf das Objekt verweist, dann wird es gelöscht.

Das hat den Vorteil, dass der Speicher für nicht mehr benötigte Objekte freigegeben werden kann. Ein Nachteil besteht allerdings darin, dass es keine eingebauten Methoden für die Iteration gibt.

Welche der hier im Thread vorgeschlagenen Lösungen am sinnvollsten ist hängt von deinem Anwendungsfall ab, über den du allerdings nicht genug gesagt hast um eine Empfehlung auszusprechen.

Zu erwähnen wäre darum höchstens noch, dass du für Objektmethoden eine im Vergleich zu deinem Beispiel vereinfachte Syntax nutzen könntest:

const object = {

  methodName (parameterList) {
    // statements
  }

};

Viele Grüße,

Orlok