function onClickCard() {
(중략)
// 두 카드의 색이 다르면
clickable = false;
setTimeout(() => {
clicked[0].classList.remove('flipped'); // flipped 클래스 제거
clicked[1].classList.remove('flipped'); // flipped 클래스 제거
clicked = []; // 클릭 배열 비우기
clickable = true;
}, 500);
}
자바스크립트로 코딩하다 보면 비동기 함수를 정말 많이 사용하게 됩니다. 물론 중간에 동기 함수도 섞여 있고요. 따라서 함수들의 실행 순서를 알고 있어야 자신이 원하는 대로 작동하는 프로그램을 만들 수 있습니다.
호출 스택과 이벤트 루프 원리를 여태껏 만든 모든 게임에 적용해 보세요. 머리가 아프겠지만, 작동 원리를 파악하는 것도 훈련해야 합니다. 이 과정을 익히면 모든 코드의 작동 순서를 파악할 수 있습니다.