Невозможно отложить выполнение funcRemove - PullRequest
0 голосов
/ 21 ноября 2018

У меня проблема с задержкой выполнения funcRemove до тех пор, пока alert не сработает.

Я пытался использовать setTimeout, но затем продолжаю выдавать ошибку, утверждающую, что removeсобственность не существует.Как выполнить задержку выполнения funcRemove до тех пор, пока не запустится alert?

const listAddCard = document.querySelectorAll ('. Card');const moveElem = document.querySelector ('. Move');

let turnCheck = 0;
let cardChecker = '';
let prevCard = '';
let moves = 3;

let matchCheck = function(evtObj){
  funcShow(evtObj);  
  console.log(turnCheck);
     if(turnCheck===1){
        setTimeout(function(){}, 1000);
        if(evtObj.target.innerHTML===cardChecker){
            evtObj.target.classList.add('match');
            prevCard.classList.add('match');
        }
        else{

            alert('No match');
        }
        funcRemove(prevCard, evtObj);
        turnCheck = 0;
        cardChecker = '';
        prevCard = '';
        moves++;
        moveElem.innerHTML = moves;
        return;
     }
     prevCard = evtObj.target;
     cardChecker = evtObj.target.innerHTML;
     turnCheck++;
 }

 let funcShow = function(e){
    e.target.classList.add('open', 'show');
    console.log('funcShow');
 }

const cardDeck = document.querySelectorAll('.card');
 for(var i=0;i<cardDeck.length;i++){
     cardDeck[i].addEventListener('click', matchCheck);
    }

let funcRemove = function (p1,p2){

        setTimeout(function(){}, 1000);    
        p1.classList.remove('open', 'show');
        p2.target.classList.remove('open', 'show');
}

1 Ответ

0 голосов
/ 21 ноября 2018

setTimeout - это асинхронная функция, которая означает, что она выполняется параллельно.Вам нужно поместить код, который вы хотите запустить после задержки 1000 мс, внутри функции в setTimeout.Например:

console.log("Print #1");
setTimeout(function() {
    console.log("Print me after 1000ms");
}, 1000);
console.log("Print #2");

"Print 2" будет напечатано сразу после "Print 1", а "Print me after 1000ms" будет напечатано позже.

Более того, вы не можете просто вернуться внутрь setTimeout.Все, что вы вводите в setTimeout, является частью функции обратного вызова: https://developer.mozilla.org/en-US/docs/Glossary/Callback_function.

Чтобы правильно использовать обратные вызовы и setTimeout в вашем случае, вот что вы хотите сделать:

let funcRemove = function (p1,p2, callback){
    p1.classList.remove('open', 'show');
    p2.target.classList.remove('open', 'show');
    setTimeout(callback, 1000);    
}

В matchCheck:

let matchCheck = function(evtObj){
funcShow(evtObj);  
console.log(turnCheck);
   if(turnCheck===1){
      setTimeout(function(){}, 1000);
      if(evtObj.target.innerHTML===cardChecker){
          evtObj.target.classList.add('match');
          prevCard.classList.add('match');
      }
      else{
          alert('No match');
      }
      funcRemove(prevCard, evtObj, function() {
          // this part is executed 1000ms later
          turnCheck = 0;
          cardChecker = '';
          prevCard = '';
          moves++;
          moveElem.innerHTML = moves;
      })

      return;
   }
   prevCard = evtObj.target;
   cardChecker = evtObj.target.innerHTML;
   turnCheck++;
}
...