# Clock

1. Intervals

매번 일어나야 하는 무언가를 만들 때 사용함.

⭐️ setInterval(실행할 함수, 함수 호출 간격)

• 함수 호출 간격 단위 : ms(milliseconds)
• 함수가 지정한 간격마다 반복해서 실행됨
  ⚠️ setInterval 안에 실행할 함수 괄호 안써서 나타내야함!
  ex)
  setInterval(clock( ), 1000) -> (X)
  setInterval(clock, 1000) -> (O)

HTML

<h2 id = "clock">00:00</h2>

JS

const clock = document.querySelector("h2#clock");

function sayHello(){
 console.log("hello");
}

setInterval(sayHello, 5000);

2. Timeout and Dates

⭐️ setTimeout(실행할 함수, 지연 시간)

• 함수가 바로 실행되지 않고 일정시간 뒤에 실행되어야 할 때 사용.

⭐️ Date

: 자바스크립트에 내장되어 있는 object
new Date( ) : 오늘 날짜를 가져옴

Date document

const date = new Date();

date.getFullYear() : 연도
date.getDate() : 일
date.getDay() : 요일
date.getHours() : 시간
date.getMinutes() : 분
date.getSeconds() : 초

🕖 시계 만들기

const clock = document.querySelector("h2#clock");

function getClock(){
 const date = new Date(); // 오늘 날짜 저장하기
 clock.innerText = `${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`;
  // 시 : 분 : 초
}

getClock() // 웹사이트 로드되자마자 실행
setInterval(getClock, 1000); // 1초에 한 번씩 반복해서 실행