Zugriff auf Klassenvariable in setTimeout-Funktion

Question

Ich habe eine JavaScript-Klasse, die Ereignisse gelegentlich veröffentlichen muss. Der Code sieht wie folgt aus:

class TimerService { 
    constructor(BroadcastService) { 
    this.Broadcast = BroadcastService; 
    this.timeout; 
    this.warningTimer; 
    this.startTimer(); 
    } 

    startTimer() { 
    clearTimeout(this.timeout); 
    clearTimeout(this.warningTimer); 
    this.timeout = setTimeout(this.startWarning, 30000); 
    } 

    startWarning() { 
    this.Broadcast.send("timeout-warning"); 
    this.warningTimer = setTimeout(this.logout, 60000); 
    } 

    logout() { 
    this.Broadcast.send("session-expired"); 
    } 
} 

export default { service: TimerService, name: "TimerService" }; 

Die Frage ist, in den SetTimeout calllback Funktionen, die this Umfang Punkte auf window so bin ich nicht in der Lage this.Broadcast zuzugreifen. Was ist der beste Weg, dies zu strukturieren, damit ich Zugang zu allem habe, was ich brauche?

Answer 1

Sie können diese beiden Ansätze verwenden. Ich denke zuerst ist das Beste, wenn Sie nichts mit dem eigenen Kontext der Funktion zu tun haben, und es ist bevorzugter Ansatz.

1) Arrow function - this.timeout = setTimeout(() => this.startWarning(), 30000);

2) Explicit Context binding - this.timeout = setTimeout(this.startWarning.bind(this), 30000);