일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- Button
- Files
- CSS
- Maven
- table
- html
- 이클립스
- date
- js
- windows
- 인텔리제이
- input
- IntelliJ
- Java
- Visual Studio Code
- Eclipse
- Array
- ArrayList
- CMD
- 자바스크립트
- 자바
- 이탈리아
- list
- json
- vscode
- javascript
- string
- 문자열
- 테이블
- 배열
- Today
- Total
어제 오늘 내일
[Javascript] 경과 시간 계산하기 (시간, 분, 초) 본문
Javascript에서 시간을 표현하고, 시간을 다루는 여러가지 방법을 알아보고 있습니다.
[HTML] 날짜 입력 항목에 현재 시간을 기본값으로 세팅하기
[Javascript] Date 객체로 원하는 날짜, 시간 표현하기
[Javascript] 날짜 계산하기 (년/월/일 더하기, 빼기)
[Javascript] 날짜 계산 (Date) 마지막 날짜(말일)/윤달/윤년 처리하기
[Javascript] 시간 계산하기 (시/분/초/ 더하기, 빼기)
이번에는 Javascript에서 주어진 두 시간 사이의
경과 시간 (시간, 분, 초)를 계산하는 방법입니다.
경과 시간 계산하기 (시, 분, 초)
두 시간 사이의 차이를 구하기 위해서는
먼저 Date 객체의 getTime() 메소드를 이용해서 각각의 날짜의 시간에 해당하는 숫자를 구하고,
그 차이를 계산하면 됩니다.
dateObj.getTime()
Date의 getTime() 메소드는 '1970년 1월1 일 00:00:00 UTC'로부터 주어진 시간 사이의 경과시간(밀리초)를 리턴합니다.
즉, '1970년 1월1 일 00:00:00 UTC'의 getTime() 값은 0입니다.
그리고, '1970년 1월 1일 00:00:01 UTC'의 getTime() 값은 1000입니다.
이를 이용해서 경과시간을 계산할 수 있습니다.
경과 시간 / 분 / 초 계산
See the Pen Date by anna (@hianna) on CodePen.
2020/7/1 0:0:0 ~ 2020/7/1 2:30:4 사이의 경과시간을 계산하고,
각 경과 시간을 초, 분, 시간 단위로 다시 환산하였습니다.
const elapsedMSec = date2.getTime() - date1.getTime();
두 시간(date1, date2)의 getTime() 값의 차는
두 시간 사이의 경과시간(밀리세컨드 단위)을 의미합니다.
const elapsedSec = elapsedMSec / 1000;
밀리세컨드(millisecond) 단위를 초단위(second)로 변환하기 위해 1000으로 나누어 주었습니다.
const elapsedMin = elapsedMSec / 1000 / 60;
밀리세컨드(millisecond) 단위의 경과 시간을 초단위(second)로 변환하기 위해 1000으로 나누어 주고,
이것을 분단위(minute)로 변환하기 위해 60으로 다시 나누어 주었습니다.
const elapsedHour = elapsedMSec / 1000 / 60 / 60;
밀리세컨드(millisecond) 단위의 경과 시간을 초단위(second)로 변환하기 위해 1000으로 나누어 주고,
이것을 분단위(minute)로 변환하기 위해 60으로 다시 나누어 주었습니다.
그리고, 시간단위(hour)로 변환하기 위해 다시 60으로 나누어 주었습니다.
See the Pen Date by anna (@hianna) on CodePen.
Date 객체의 연산을 할때는 getTime() 메소드를 사용하지 않고,
Date 객체끼리 연산을 해도 getTime() 메소드를 사용하여 연산한 것과 같은 결과를 얻을 수도 있습니다.
'IT > Javascript' 카테고리의 다른 글
[Javascript] 배열인지 확인하기 - isArray() (0) | 2020.07.28 |
---|---|
[Javascript] 데이터 타입 확인하기 - typeof (0) | 2020.07.28 |
[Javascript] 절대값 구하기 (0) | 2020.07.26 |
[Javascript] 문자열 숫자로 변환하기 (3) - +, * 연산자 사용 (1) | 2020.07.25 |
[Javascript] 문자열 숫자로 변환하기 (2) - parseFloat() (0) | 2020.07.24 |