Wie funktioniert `this` in Javascript?

Question

Ich verstehe nicht vollständig, wie this funktioniert. Zum Beispiel

var logger = { 
x: 0, 
updateCount: function(){ 
    this.x++; 
    console.log(this.x); 
    } 
} 

nun von dem, was ich gelesen habe, ist der Wert von this wenn updateCount als Eigenschaft logger genannt wird, soll logger sein. Warum funktioniert der folgende Code nicht?

document.querySelector('button').addEventListener('click', logger.updateCount); 

Auch, warum funktioniert das?

document.querySelector('button').addEventListener('click', function(){ 
logger.updateCount(); 

});

Answer 1

In der ersten übergeben Sie eine Funktion als Parameter, und sie wird dort aufgerufen. Daher wird der Anrufer nicht Logger sein. Und "das" hängt vom Anrufer ab. Auf der zweiten, wie Sie sehen können, rufen Sie die Funktion vom Logger auf, also "das" ist Logger.

Sie können die erste wie folgt ändern, so dass ihr "dies" als Logger eingestellt ist.

document.querySelector('button').addEventListener('click', logger.updateCount.bind(logger));