Quiero llamar a la función "displayTime" en "startTimer", pero por alguna razón aparece "Error de tipo no detectado: this.displayTime no es una función" en la consola.
let endTimer = "0"; let isRunning = false; //! CLASS class Timer { constructor(endTimer, isRunning) { this.endTimer = endTimer; this.isRunning = isRunning; } startTimer() { if (this.endTimer === "0") { this.endTimer = new Date().getTime() + 1500000; } displayTime(); if (this.isRunning === true) { this.pauseTimer(); this.isRunning } this.isRunning = true; } displayTime() { let now = new Date().getTime(); let remainingTime = this.endTimer - now; let minutes = Math.floor(remainingTime / 1000 / 60); let seconds = Math.floor((remainingTime / 1000) % 60); if (seconds < 10) { seconds = "0" + seconds; } timer.innerHTML = `<h1>${minutes}:${seconds}</h1>`; start.textContent = "STOP" this.update = setInterval(this.displayTime, 100); } } let newTimer = new Timer(endTimer, isRunning); //! EVENT LISTENERS start.addEventListener("click", newTimer.startTimer);Creo que me estoy perdiendo algo obvio, pero no entiendo qué...
Llamando a mostrarTiempo(); sin la palabra clave antepuesta 'este' es el problema principal (línea 16 a continuación) como lo mencionan GenericUser y Heretic Monkey en los comentarios anteriores.
Probablemente ya sepa esto, pero también querrá definir un método/función pauseTimer().
let endTimer = "0"; let isRunning = false; //! CLASS class Timer { constructor(endTimer, isRunning) { this.endTimer = endTimer; this.isRunning = isRunning; } } Timer.prototype.startTimer = function() { if (this.endTimer === "0") { this.endTimer = new Date().getTime() + 1500000; } this.displayTime(); // this is the important line if (this.isRunning === true) { this.pauseTimer(); this.isRunning } this.isRunning = true; } Timer.prototype.displayTime = function() { let now = new Date().getTime(); let remainingTime = this.endTimer - now; let minutes = Math.floor(remainingTime / 1000 / 60); let seconds = Math.floor((remainingTime / 1000) % 60); if (seconds < 10) { seconds = "0" + seconds; } //timer.innerHTML = `<h1>${minutes}:${seconds}</h1>`; //start.textContent = "STOP" this.update = setInterval(this.displayTime, 100); } Timer.prototype.pauseTimer = function() { this.isRunning = false; } let newTimer = new Timer("0", true); newTimer.startTimer(); //! EVENT LISTENERS //start.addEventListener("click", newTimer.startTimer);start.addEventListener("click", newTimer.startTimer.bind(newTimer));
class Timer { startTimer() { // You forgot this keyword this.displayTime(); } displayTime() { console.log('do something'); } } let newTimer = new Timer(); // addEventListener changes the context of this. // Using an arrow function will keep 'this' keyword in tact inside startTimer method start.addEventListener('click', () => newTimer.startTimer)