1초 타이머를 구현하는데는 setInterval({ }, 1000)함수를 써야겠다는 생각이 들었다.

그렇다면 10초를 디폴트 값으로 하고 역으로 가는 타이머는 어떻게 구현할까

우선 10을 변수에 할당한다.

let timerSec = 10;

setInterval 함수 만들기

setInterval(() => {
	1초마다 동작할 함수 만들기
}, 1000);

1초마다 동작하는 기능은 타이머에서 초가 거꾸로 내려가는 것이기 때문에 타이머 숫자를 text에 넣어주는 함수를 만든다.

앞에는 분, 뒤에는 초를 보여주는 타이머를 만들 것이다.

ⅰ) 타이머가 70초라고 가정했을 때,

분 단위는 1, 초 단위는 10이 될것이다.

그러면 분과 초를 각각 변수에 할당한다.

분의 1이라는 결과가 도출 된 과정은 70초를 60으로 나눈 몫만 가져온 것이고, 초의 10은 70초를 60으로 나눈 나머지만 가져온 것이다.

🚩 Math.floor( ) - 값의 버림을 하여 정수를 반환한다.

const number = 22.7
console.log(Math.floor(number)); // 22

const minutes = Math.floor(time / 60);

🚩 number % number - 나눈 나머지 값 반환

const seconds = time % 60

updateGameTimer 함수 만들기

function updateGameTimer(time) {
  const minutes = Math.floor(time / 60);
  const seconds = time % 60;
  gameTimer.innerText = `${minutes} : ${seconds}`;
}