Javascript - предупреждение перед событием клика

Question

Я написал этот метод, который переворачивает карту лицевой стороной вверх onClick, а затем отображает метод alert. Однако по какой-то причине, когда я нажимаю на карту, она остается лицевой стороной вниз, и отображается метод alert. Затем, когда я закрою предупреждение, карта перевернется.

Как мне перевернуть карту, а затем отобразить alert?

... 
newCard.addEventListener('click', flipCard); 
... 

//method to flip card face up 
function flipCard() { 

    cardsInPlay.push(this.getAttribute('data-card')); 

    if(this.getAttribute('data-card') == 'king'){ 
     this.innerHTML = '<img src="my_king.png" alt="King of Spades" />'; 
    } 

    if(this.getAttribute('data-card') == 'queen'){ 
     this.innerHTML = '<img src="my_queen.png" alt="Queen of Spades" />';    
    } 

    if (cardsInPlay.length === 1) { 
     alert("Congrats, you flipped a card"); 
     } 

} 

Answer 1

Насколько я понимаю, правильный способ - использовать обещания и обратные вызовы.

https://www.sencha.com/blog/asynchronous-javascript-promises/

Таким образом, вы можете запустить функцию, которая создает тревогу только после того, как некоторые работы было сделано, т.е. вы изменили innerHtml текущей карты.

хитроумный способ будет делать что-то вроде:

setTimeout(function() { 
    alert("Congrats, you flipped a card"); 
}, 500);