Fat Arrows | this

[Rolf B]

Hallo heinetz,

new window.Waypoint({
      element: this.elements.self,
      handler: function(direction) {
        console.log('handler()');
        console.log(this);
      }
    });

Ich bin mit der neueren OOP-Syntax von JS noch nicht sattelfest (weil ich für IE11 programmieren muss und darum diese Syntax nicht nutzen kann, ohne meine Toolchain mühsam zu verlängern). Deswegen deute ich vielleicht was falsch.

Aber für mich sieht das aus wie ein Konstruktoraufruf, der ein Objekt übergeben bekommt. Dieses Objekt hat eine Eigenschaft element, und weil das ein Konstruktorparameter ist, ist das this, das beim Zuweisen dieser Eigenschaft verwendet wird, das Footer Objekt. Die zweite Einenschaft ist die Methode handler, und welchen Wert this in dieser Methode hat hängt vom Aufruf ab.

EVENTUELL ist der Waypoint-Konstruktor so programmiert, dass er die Eigenschaften dieses Objekts auf die Eigenschaften des erzeugten Waypoint-Objekts kopiert. Das ist dann aber eine Waypoint-Eigenschaft, keine von JavaScript. Und dann würde die handler-Funktion das Waypoint-Objekt als this erhalten. Alternativ könnte Waypoint die handler-Funktion so aufrufen, dass es sich selbst als this übergibt (mittels handler.call oder handler.apply).

Arrow-Funktionen haben dagegen kein eigenes this, d.h. an dieser Stelle wird das this des Aufrufkontextes gebunden. Deswegen sollte es so sein, dass das this der handler-Funktion das Footer-Objekt referenziert. Ein Aufruf mit .call oder .apply hat keinen Effekt.

Rolf