[바닐라 JS] 크롬 앱 만들기 (2)

interval

매번 반복되어 일어나는 행위

setInterval() 함수 사용

 

 

setInterval

첫번째 인자는 실행하고자 하는 함수

두번째 인자는 호출된 함수를 몇 ms(milliseconds)로 할 지 표기

 

 

timeout

미리 정해둔 지연된 시간에 도달할 때 발생

setTimeout() 함수 사용

 

 

setTimeout

첫번째 인자는 실행하고자 하는 함수

두번째 인자는 기다리고자 하는 ms(milliseconds) 단위

 

 

Date Object

const date = new Date();
date.getDate() //일
date.getDay() //요일
date.getFullYear() //연도
date.getHours() //시
date.getMinutes() //분
date.getSeconds() //초

 

 

padStart 

string 길이의 남은 앞자리에 패딩추가

 

padEnd

string 길이의 남은 뒷자리에 패딩추가

 

숫자에는 적용할 수 없으므로 String 함수를 통해 문자로 바꾸어준 후에 적용해야 한다.

 

 

 

clock 코드

- JS

const clock=document.querySelector('#clock');

function getClock(){
    const date=new Date();
    const hours=String(date.getHours()).padStart(2,"0"); 
    const minutes=String(date.getMinutes()).padStart(2,"0");
    const seconds=String(date.getSeconds()).padStart(2,"0");
    clock.innerText=`${hours}:${minutes}:${seconds}`;
}

getClock(); //즉시 호출
setInterval(getClock, 1000); //1초마다