시계만들기

const clockContainer = document.querySelector(".js-clock"),
    clockTitle = clockContainer.querySelector("h1");

function getTime(){
    const date = new Date();
    const minutes = date.getMinutes();
    const hours = date.getHours();
    const seconds = date.getSeconds();
    clockTitle.innerText = `${hours < 10 ? `0${hours}`:hours}:${minutes < 10 ? `0${minutes}`:minutes}:${seconds < 10 ? `0${seconds}` : seconds}`;
}

function init(){
    getTime();
}
init();

위 코드의 문제점

• data( ) 변수를 만드는 시점의 시간을 기준으로 출력이 되므로 새로고침하여 시간을 업데이트해줘야 합니다.

해결방법

function init(0{
	getTime();
    	setInterval(getTime, 1000);
}

• setInterval( ) 함수를 이용하여 원하는 함수를 원하는 시간마다 실행시켜줌으로 해결할 수 있습니다.

삼항조건연산자

condition ? exprIfTrue : exprIfFalse 

• condition이 참이라면 exprIfTrue을 반환, 거짓이라면 exprIfFalse를 반환합니다.