Блог

Главная - Вопросы по программированию - Ванильный Javascript удаляет обещание

Ванильный Javascript удаляет обещание

#javascript #promise #async-await

#javascript #обещание #асинхронный-ожидание

Вопрос:

У меня есть render() функция, и внутри нее есть эта sleep() функция:

 const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

(Используя это внутри асинхронной функции)

При первом запуске все в порядке, но когда я нажимаю на кнопку «Новая игра» (которая вызывает render() ), создается новая Promise , но предыдущая все еще там. Таким sleep() образом, время подсчета удваивается.

Я прочитал документацию MDN и некоторые вопросы stackoverflow, но не нашел ответа на этот вопрос.

Может кто-нибудь объяснить мне, как Promise на самом деле работает, и что я сделал не так?

РЕДАКТИРОВАТЬ: когда игра закончена и нажмите кнопку «Новая игра», все выглядит нормально, кроме таймера, который отсчитывает секунды дважды. Код:

 const render = () => {
  const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
  const timerOnePlayer = async () => {
     timer.innerHTML = 0;
     timerText.innerHTML = "Eltelt idő";
     while (!gameFinished) {
       await sleep(1000);
       timer.innerHTML = Number(timer.innerHTML)   1;
     }
  }
/** Some other irrelevant code*/
}

const resetValues = () => {
   /** variables set to zero or empty */
   render();
}

btnStart.addEventListener("click",render);
newGame.addEventListener("click",resetValues);

Комментарии:

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

2. Это внутри функции, которая возвращается в конце игры. Я думаю (может быть, это неправильно), если функция вернется, каждая переменная и все, что я создал внутри нее, будут удалены по умолчанию. По крайней мере, в Java это работало так. Поэтому я думаю, что проблема либо в Promise or async .

3. Что вы пытаетесь сделать с этим кодом в первую очередь? Похоже, это const sleep = (ms,resolve) => setTimeout(resolve,ms); позволит вам подождать определенное количество времени, а затем запустить функцию обратного вызова. Или просто вызывая setTimeout без его завершения.

4. Ваша версия sleep лучше, я не знал, что это работает таким образом. И использование этой функции: const timerOnePlayer = async () => { /** ... */ while (!gameFinished) {await sleep(1000); } /** ... */}; . Извините за редактирование.

5. Пожалуйста, покажите нам ваш фактический код для функции, а затем опишите в терминах этого фактического кода, в чем проблема.

Ответ №1:

Когда я начинал этот проект, я действительно не знал, как Promise setIntervall это работает. Но с комментариями я понял, что не так, удален sleep() из проекта и заменен на just setIntervall . Теперь все работает нормально, так что еще раз спасибо!

 const timerOnePlayer = () => {
    timer.innerHTML = 0;
    timerText.innerHTML = "Eltelt idő";
    onePlayerInterval = setInterval(() => {
      timer.innerHTML = Number(timer.innerHTML)   1;
      if (gameFinished) clearInterval(onePlayerInterval);
    }, 1000);
  };