“Tiempo de espera no disminuyendo el valor del parámetro”

Estoy intentando hacer que mi función setTimeout sea reutilizable. Pero cada vez que paso el valor “remainingTime”, no se decrementa.

“console.log(remainingTime);” devuelve repetidamente “99” en lugar de decrementar, es decir, “98”, “97”.

¿Alguna idea?

let remainingTimeToSolveQuiz = 100;
const timeRemainingEl = document.querySelector(“#time-remaining”);

function quizCountDown(remainingTime, elementToDisplayTime) {

remainingTime–;
console.log(remainingTime);

if (remainingTime === 0) {
// algo
clearTimeout(timer);
}
elementToDisplayTime.textContent = remainingTime;
}

let quizTimer = setInterval(quizCountDown, 1000, remainingTimeToSolveQuiz, timeRemainingEl);

Tiempo:

davy.ai

June 5, 2023 at 1:59 pm

El problema es que la variable remainingTime no está siendo actualizada en la función setInterval, lo que hace que siempre tenga el valor original de 100. Para hacer que la función setTimeout sea reutilizable, puedes crear una función que devuelva otra función con el valor de parámetro deseado. Esto se llama un closure.

Aquí tienes un ejemplo de cómo puedes crear una función reutilizable:

function quizCountDown(remainingTime, elementToDisplayTime) {
  return function() {
    remainingTime--;
    console.log(remainingTime);
    if (remainingTime === 0) {
      // algo
      clearTimeout(timer);
    }
    elementToDisplayTime.textContent = remainingTime;
  }
}

let quizTimer = setInterval(quizCountDown(remainingTimeToSolveQuiz, timeRemainingEl), 1000);

Ahora, la función setInterval está pasando un closure de la función quizCountDown con los parámetros iniciales remainingTimeToSolveQuiz y timeRemainingEl que se utilizan para crearla. Esto permite que el valor de remainingTime se actualice con cada ejecución del closure.

Answer

davy.ai

June 5, 2023 at 1:59 pm
El problema es que la variable remainingTime no está siendo actualizada en la función setInterval, lo que hace que siempre tenga el valor original de 100. Para hacer que la función setTimeout sea reutilizable, puedes crear una función que devuelva otra función con el valor de parámetro deseado. Esto se llama un closure.

Aquí tienes un ejemplo de cómo puedes crear una función reutilizable:
```
function quizCountDown(remainingTime, elementToDisplayTime) {
  return function() {
    remainingTime--;
    console.log(remainingTime);
    if (remainingTime === 0) {
      // algo
      clearTimeout(timer);
    }
    elementToDisplayTime.textContent = remainingTime;
  }
}

let quizTimer = setInterval(quizCountDown(remainingTimeToSolveQuiz, timeRemainingEl), 1000);
```
Ahora, la función setInterval está pasando un closure de la función quizCountDown con los parámetros iniciales remainingTimeToSolveQuiz y timeRemainingEl que se utilizan para crearla. Esto permite que el valor de remainingTime se actualice con cada ejecución del closure.

Comments are closed.

es.davy.ai

¿Tienes una pregunta?

“Tiempo de espera no disminuyendo el valor del parámetro”

Answer

davy.ai