이다닷

[JavaScript] Day 20 - 디지털 시계 만들기 본문

JavaScript

[JavaScript] Day 20 - 디지털 시계 만들기

이다닷 2023. 2. 23. 21:01

내장 생성자 (= 빌트인 객체)

처음부터 사용할 수 있는 기본 객체 및 생성자를 제공한다.

 

Date 

Date는 날짜와 시간을 처리하는 다양한 메소드가 정의된 내장 생성자이다.

Date를 통한 객체생성은 다음과 같은 형태로 이루어진다.

 

const now = new Date()

// 코드가 실행되는 시점의 날짜와 시간 정보를 담은 객체

 

const then = new Date(2005, 5, 10)

// 2005년 6월 10일의 날짜와 시간 정보를 담은 객체

 

Date 객체 주요 메소드

메소드 기능 특이사항
getFullYear 연도를 뜻하는 숫자 값 반환  
getMonth 월을 뜻하는 숫자 값 반환 0부터 시작하므로 1월이면 0 반환
getDate 날짜를 뜻하는 숫자 값 반환  
getDay 요일을 뜻하는 숫자 값 반환 0부터 시작하므로 일요일이면 0 반환
getHours 시각 중 시간을 나타내는 숫자 반환  
getMinutes 시각 중 분을 나타내는 숫자 반환  
getSeconds 시각 중 초를 나타내는 숫자 반환  
toLocaleString 지역 날짜 및 시간 문자열 반환 '2023/02/22 18:10:30' 이런 형태

 

타이머를 만들어보자

setTimeout

정해진 시간이 지나고 나면 주어진 함수를 실행 해주는타이머 메소드!

 

사용방법

setTimeout(실행할함수, ms단위의시간)

 

setInterval

일정한 시간 간격에 따라 함수를 반복 실행할 수 있도록 해주는 타이머메소드!

 

사용방법

setInterval(반복실행할함수, ms단위의시간)

 

clearInterval

setInterval 메소드가 호출되어 반복 실행할 함수 타이머를 등록하면, 타이머는 0이 아닌 숫자를 반환한다.

숫자는 타이머의 ID를 의미하며, 이를 clearInterval 메소드에 전달하면 해당 타이머의 반복 실행이 취소된다.

 

사용방법

clearInterval(타이머의이름)

 

타이머 완성 사진