Necesito mostrar this.name en la consola al hacer clic en el elemento del botón.
Podría reemplazar dentro de clicked() y establecer console.log(myBtn.name) pero me gustaría que este método funcione con cualquier objeto.
¿Hay una manera de hacerlo? Cuando hago clic obtengo una cadena vacía.
¡Gracias!
class Button { constructor(name, id) { this.name = name; this.ref = document.getElementById(id); this.init(); } init() { this.ref.addEventListener("click", this.clicked); } clicked() { console.log(this.name); } } let myBtn = new Button('My button', "test"); <button id="test">Click me</button>casi estabas allí
El problema en su código es lo que esto significa en la devolución de llamada
Cuando se presiona el botón, this es el botón a menos que le indique lo contrario
class Button { constructor(name, id) { this.name = name; this.ref = document.getElementById(id); this.init(); } init() { this.ref.addEventListener("click", this.clicked.bind(this)); } clicked() { console.log(this.name); } } let myBtn = new Button('My button', "test"); <button id="test">Click me</button>