heinetz: variabler Methodenaufruf

Hallo Forum,

ich möchte eine 'variable Methode' aufrufen ... keine Ahnung, wie ich das besser formulieren kann. Daher erstmal folgend Quellcode:

import BaseModule from '../../../../javascripts/helpers/baseModule';
import forEach from '../../../../javascripts/dom/forEach';

export default class ShareLink extends BaseModule {
  constructor(element) {
    super(element, element.getAttribute('data-js-module'));

    this.getElements([]);

    this.bindEvents();

    this.clickMethods = { facebook: 'handleFacebook' };
  }

  bindEvents() {
    console.log('bindEvents()');
    this.elements.self.addEventListener('click', this.handleClick.bind(this));
  }

  handleClick(event) {
    console.log('handleClick()');
    event.preventDefault(event);
    const method = this.elements.self.dataset.jsType; // value: facebook
    this.clickMethods[method]();
  }

  handleFacebook() {
    console.log('handleFacebook()');
  }
}
  • Die Methode handleClick wird aufgerufen
  • const method wird mit dem Wert 'facebook' belegt

...und mit this.clickMethods[method](); versuche ich die methode handleFacebook. Das funktioniert so leider nicht ;(

Kann mir jemand nen Tipp geben, wie ich das vernünftig löse?

beste gruesse, heinetz

  1. Tach!

    export default class ShareLink extends BaseModule {
      constructor(element) {
        this.clickMethods = { facebook: 'handleFacebook' };
      }
    
      handleClick(event) {
        const method = this.elements.self.dataset.jsType; // value: facebook
        this.clickMethods[method]();
      }
    
      handleFacebook() {
        console.log('handleFacebook()');
      }
    }
    
    • Die Methode handleClick wird aufgerufen
    • const method wird mit dem Wert 'facebook' belegt

    ...und mit this.clickMethods[method](); versuche ich die methode handleFacebook. Das funktioniert so leider nicht ;(

    Ja klar, this.clickMethods['facebook'] ist keine Funktion sondern ein String.

    Kann mir jemand nen Tipp geben, wie ich das vernünftig löse?

    Ich würde nicht mit Magic Strings hantieren, sondern mit richtigen Verweisen.

    this.clickMethods = { facebook: this.handleFacebook };

    Das geht aber nur, wenn in handleFacebook kein Bezug auf this notiert ist, also wenn handleFacebook eigentlich eine statische Methode ist. Ansonsten braucht es da noch eine Wrapper um den Aufruf, der den this-Kontext bewahrt.

    dedlfix.

    1. danke, das passt.

      lg, heinetz