CHAPTER 2 041 소수점 자릿수 지정하기

하유민·2021년 1월 29일
0

숫자값.toFixed([자릿수])

예시 1

(0.3333).toFixed(2); // 0.33 

예시 2

(2.4).toFixed(4); // 2.4000 

[카운트다운 함수]

HTML

<body>
    <div class="second">

    </div>
</body>

Javascript

// 초단위용 element
const secondElement = document.querySelector('.second');

// 15초를 목표치로 지정
const goalTime = new Date().getTime() + 15 * 1000;

// getTime() : 1970년 1월 1일을 기준으로 경과된 
//시간을 밀리초로 알려준다. 

// 따라서 newDate().getTime() 은 1970년 1월 1
// 일부터 현재 시각까지 경과된 시간을 밀리초로 반환
// 한 것이고, 여기에 15* 1000(밀리초 변환을 위해 *1000 함. ) 을 함으로써 현재 
// 시각까지 경과된 시간 + 15초 를 계산해준것.  


update();
// update() 함수 실행 . 

// update 함수 정의 
function update() {
    // 현재 시각
    const currentTime = new Date().getTime();

    // 목표치까지 남은 시간 
    const leftTime = goalTime - currentTime;

    //남은 시간이 0초 미만이면 타이머 정지.
    // 초 단위 표시. 밀리초는 소수점 두 자리까지 . 
    secondElement.innerText = (leftTime / 1000).toFixed(2);

    // 프레임에서 update() 재실행
  	// 1초에 한 번씩 다시 실행된다. 
    requestAnimationFrame(update);
}

결과

profile
💻프론트엔드개발자

0개의 댓글

관련 채용 정보