clearInterval не работает и увеличивает интервальную скорость

Я делаю игру в блэкджек, которая содержит таймер. Таймер должен перезапуститься, если игрок решит взять новую карту. Когда я нажимаю кнопку рисования, он сбрасывается, но увеличивает интервальную скорость на 1.

const createCountDown = (isPlayerDrawed = false) => {
  delay = 10;
  let Timer = document.getElementById('timer');
  if (isPlayerDrawed == true) {
    delay = 10;
    clearInterval(timer);
    createCountDown(false);
  } else {
    let timer = setInterval(() => {
      if (delay <= 0) {
        clearInterval(timer);
        stay();
      } else {
        delay--;
        Timer.innerHTML = delay;
      }
    }, 1000)
    console.log(timer)
  }
}

введите здесь описание изображения

Как я могу решить эту проблему?


javascript setinterval clearinterval countdowntimer
person Kerem H.    schedule 29.02.2020    source источник
comment
первый clearInterval(timer), вероятно, ничего не делает, поскольку область действия таймера ограничена областью, в которой он определен с помощью let timer. Вероятно, вам следует определить таймер перед первым if, поэтому он находится в области действия обоих вызовов clearInterval.   -  person Erik Gomersbach    schedule 29.02.2020
comment
Спасибо за ваш ответ, определив таймер раньше, если это не изменило ситуацию.   -  person Kerem H.    schedule 29.02.2020
comment
предоставление рабочего фрагмента кода было бы полезно   -  person Mhmdrz_A    schedule 01.03.2020

Ответы (2)


arrow_upward
0
arrow_downward 

const createCountDown = (isPlayerDrawed = false, delay) => {
counter = delay;
let Timer = document.getElementById('timer');
let interval = null
if (isPlayerDrawed === true) {
    clearInterval(interval);
} else {
    interval = setInterval(() => {
        Timer.innerHTML = counter;

        if (counter <= 0) {
            clearInterval(interval);
            stay();
        } else {
            counter--;
        }

    }, 1000)
}

}

изменение такой функции сработало для меня.

person Kerem H.    schedule 29.02.2020

arrow_upward
0
arrow_downward

Ваш let timer ограничивается только блоком else. Другие ссылки будут ссылаться на глобальную переменную.

Вот как вы можете заставить это работать:

let Timer = document.getElementById('timer');
const stay = () => Timer.textContent = "timer expired!";

const createCountDown = (function () {
    let delay, timer;

    function reset() {
        delay = 10;
        clearInterval(timer);
        timer = 0;
        Timer.textContent = "";
    }
    
    reset();
    
    return function () {
        reset();
        Timer.textContent = delay;
        timer = setInterval(() => {
            if (delay <= 0) {
                reset();
                stay();
            } else {
                delay--;
                Timer.textContent = delay;
            }
        }, 1000);
    }
})();
// Optionally start timer immediately:
createCountDown();

document.getElementById('draw').addEventListener("click", createCountDown);
<button id="draw">Draw</button>
<p id="timer"></p>

person trincot    schedule 29.02.2020