Cuando uso funciones de flecha, el contexto de recuento es accesible y funciona:
class Counter { count = 0 constructor({ countElementId, incrementElementId, decrementElementId }){ this.countElement = document.getElementById(countElementId) this.incrementElement = document.getElementById(incrementElementId) this.decrementElement = document.getElementById(decrementElementId) this.incrementElement.addEventListener("click", () => this.incrementCount()) this.decrementElement.addEventListener("click", () => this.decrementCount()) } incrementCount(){ this.countElement.innerText = ++this.count } decrementCount(){ this.countElement.innerText = --this.count } } function main () { const peopleCounter = new Counter({ countElementId: "count-el", incrementElementId : "increment-btn", decrementElementId: "decrement-btn" }) } main()Pero count deja de ser accesible cuando lo cambio de esta manera en el constructor:
this.incrementElement.addEventListener("click", this.incrementCount) this.decrementElement.addEventListener("click", this.decrementCount)