Javascript getter wo wird er getriggered?

[Hendoul]

Hi

const items = [{val: 2}, {val:4}]

const getItemsWithWeightsGetter = () => {
  let totalSum;

  return items.map(item => ({
    ...item,
    get weight() {
      console.log('hello');
      if (totalSum === undefined) {
        totalSum = items.reduce((acc, cur) => acc + cur.val, 0);
      }
      return item.val / totalSum;
    }
  }));
};


const itemsWithWeightsGetter = getItemsWithWeightsGetter();
console.log(itemsWithWeightsGetter);

Kann mir jemand erklären, warum die Objekte in itemsWithWeightsGetter bereits über das berechnete weight property verfügen ohne das .weight aufgerufen wurde?


edit:
Hat sich erledigt. Hab grad rausgefunden, dass das console.log wohl den getter triggert.

 

[CyborgBeta]

Hat sich erledigt. Hab grad rausgefunden, dass das console.log wohl den getter triggert.

Du übergibst dem ein Objekt, oder besser gesagt eine anonyme Funktion, und die Konsole ruft alles darauf auf, was es kriegen kann.

Ergänzung (16. August 2024)

Hier noch ein anderes Beispiel, abgeleitet von https://stackoverflow.com/a/52106649/16293187 :

const person = {
    firstName: 'Willem',
    lastName: 'Veen',
    get fullName() {
        return `${this.firstName} ${this.lastName}`;
    }

}

console.log(person);
// When the person is passed
// the getter function gets executed and its
// returned value will be the value of fullname

Statt console.log('hello'); kannst du auch .caller aufrufen ...

 

[H4110]

Kann mir jemand erklären, warum die Objekte in itemsWithWeightsGetter bereits über das berechnete weight property verfügen ohne das .weight aufgerufen wurde?

Ich lese da ein falsches Verständnis von Gettern heraus. Der Getter ist das Property. Er wird bei jedem Zugriff auf .weight aufgerufen. Das ist kein Lazy- oder Memoizer-Pattern, also dass das Property beim ersten Zugriff durch den Getter erzeugt wird.

Du übergibst dem ein Objekt, oder besser gesagt eine anonyme Funktion, und die Konsole ruft alles darauf auf, was es kriegen kann.

Eigentlich ist die Variable itemsWithWeightsGetter ein Array (okay, Arrays sind auch Objekte). Sie wird sofort mit dem Rückgabewert von getItemsWithWeightsGetter() initialisiert. Dass getItemsWithWeightsGetter eine Variable mit Arrow-Function ist, macht hier übrigens keinen Unterschied zur gewöhnlichen Deklaration als function. Dadurch wird nichts auf magische Weise lazy, falls Du (Hendoul) das gedacht hast.

Das einzige, was hier lazy ist, ist totalSum.

 

[CyborgBeta]

@H4110 ja, ich hab das falsch formuliert, der Getter ist eigentlich ein Attribut der Klasse, somit wird er auch aufgerufen, wenn die Attribute der Klasse angefragt werden. Also so, wie du es beschrieben hast.

 

[SheepShaver]

Da du keine class Syntax verwendest, hat das mit Klassen recht wenig zu tun. Das ist einfach nur ein Objekt.

 

[CyborgBeta]

Das ist einfach nur ein Objekt.

Mit Properties, ja. Und Properties sind vergleichbar mit Attributen einer Klasse.