[JS] pad.Start(); 메서드 시계에 적용하기

모질라 참고

pad.Start 메서드를 이용하면 시간을 알려주는 function을 짤 때 도움이 된다. 

pad.Start 메서드를 사용하지 않을 때와 사용할 때의 차이를 미리 보여주겠다.

 

 

 

 

 

pad.Start 메서드를 사용하지 않았을 때

보다시피 무언가가 어색하다 자바 스크립트에 내장된 new Date 객체는 한 자리수 숫자를 그대로 보여준다. 

앞에 01, 02초 이렇게 반환되지 않으니 볼 때 뭔가 허전한 느낌이 들 수 있다. 

 

여러 가지 방법으로 시간을 나타내주는 함수에 0을 한 자리수 일때 붙여주고 그렇지 않을 때는 굳이 붙여주지 않는 로직을 

직접 고안해서 구현할 수도 있겠지만, 자바스크립트, 브라우저에서 기본적으로 제공해줌으로써 더 간편하게 코드를 짤 수 있는데 

돌아가지 않는 것이 더 좋지 않을까?

 

 

pad.Start();의 문법은 매우 간단하다 

 

padStart();에는 파라미터 두 가지가 사용되는데  

(targetLength, padString)이 그 두 가지다.

targetLength는 메서드를 적용한 객체의 길이 숫자 조건에 해당하고, padString은 숫자 조건에 해당하지 않을 때 파라미터로 넣어준 

"문자열"을 넣어줄 값이다. 

 

예시)

각각의 시, 분, 초를 변수에 할당하였고, 각각 String 메서드 (숫자열을 문자열로 바꿔주는 메서드)를 먼저 적용하고 반환된 문자열의 수가 '2'가 아닐때 대상의 시작인 좌측부터 두 번째 파라미터에 넣어준 문자열 "0"을 채워준다.

 

 

 

결과) 

 

padStart 메서드가 아주 잘 처리해주고 있음을 볼 수 있다.