Vanilla Js -clock2 (template literal)

Minji Kang·2020년 12월 26일
0

javascript

목록 보기
5/6



-Template literal

백틱 기호(``)를 사용하여 template literal을 사용해보자

`` 이 기호안에는 변수를 넣어 치환할때도 ${}안에 변수명을 넣으면 된다.
줄바꿈을 할때도 그냥 워드에서 줄바꿈 하듯이 띄어주면 된다.

이것으로 시계를 표현해보자.


> clock.innerText = `${hours}:${minutes}:${seconds}`;

-조건부 연산자(()? true:false)

미니 if문이라 해야할까
조건에 따라 반환값을 달리하려는 목적으로 사용한다.
(조건)? true : false 로 간결하게 조건문을 사용할 수 있다.

시,분,초가 9이하일때 0을 붙여 나오게 하려면
조건을 세워 넣어야 한다.

hours 가 9 이하일때 0${hours} 반환하기
(hours <10) ?  `0${hours}` : hours


> clock.innerText = `${hours < 10 ? `0${hours}` : hours}:${minutes <10 ? `${minutes}` : minutes}:${seconds<10 ? `0${seconds}` : seconds}`;

profile
코딩의 해상도 높이기

0개의 댓글

관련 채용 정보