[JS] Javascript에서 시간을 다루는 방법

GuruneLee·2022년 6월 19일
0

Let's Study 공부해요~

목록 보기
18/36

서버와 클라이언트 간 시간 데이터 전달

서버에서 클라이언트로, 서버에서 데이터베이스로, 클라이언트에서도 모듈에서 모듈로, 컴포넌트에서 컴포넌트로 'Date Time' 즉 '시간' 데이터를 전달하고 전달 받을때, 데이터 포맷을 UTC로 통일하는것이 좋다.
한국에서 개발한 서버라고 클라이언트에서 서버로, 서버에서 클라이언트로, 서버에서 DB로, DB에서 서버로 한국 시간 (GMT+9)을 나타내는 스트링을 운송한다고 하면 안좋다는 말이다 (물론 {'date string', locale} 쌍으로 주면 상관없겠지만...)
사용자가 사용할 때만 local time으로 바꿔서 주면 ok다.

물론, 개인적인 의견.

JS의 Date객체

JS에선 시간을 다루기 위한 객체로 Date를 사용한다.

Date 객체 생성

// 기본 생성자
const now = new Date()

now는 Date생성자가 실행된 시간이 담긴 Date객체이다.

console.log(now instanceof Date)

Date 생성자에 argument로 '시간처럼 생긴 스트링'을 담으면 해당 시간을 가리키는 Date객체를 얻을 수 있다.
시간처럼 생긴 스트링이 진짜 date string일까?

// yyyy-MM-dd
const now = new Date('2022-01-01')
console.log(now) // Sat Jan 01 2022 09:00:00 GMT+0900 

date string의 포맷에 따라 예상과 다른 Date객체를 만들 수 있으니 주의하자

// yyyy-MM-dd HH:mm:ss
const now = new Date(`2022-01-01 00:00:00`)
console.log(now) // Sat Jan 01 2022 00:00:00 GMT+0900

Date 객체 to String

Date객체를 string으로 만드는 방법은 여러가지이다.
당연하다. 시간의 기준은 협정세계시(UTC) 하나지만 이 시간은 지역에 따라 offset이 달라지며, 목적에 따라 여러 포맷으로 표현할 수 있기 때문.

human-readable (en)

1) toDateString()
Date객체 중 날짜 부분만 영어와 숫자를 이용한 스트링으로 반환한다
Thu Apr 12 2018
2) toTimeString()
시간 부분만 영어와 숫자를이용한 스트링으로 반환한다
14:05:16 GMT+0900
3) toString()
날짜와 시간 모두 영어와 숫자를 이용한 스트링으로 반환한다.
Sun Jun 19 2022 14:06:16 GMT+0900 (Korean Standard Time)

ISO 8601

ISO란 'International Organization for Standardization'의 약자로, 여러가지 국제 표준을 정의하고 관리하는 기관이다.
그 중 ISO 8601은 그레고리력 날짜와 24시 시간체계를 기준으로 하는 시간표현에 대한 표준이다 (자세한 내용은 ISO 8601문서에서 확인하자).
1) toISOString()
Date 객체를 ISO 8601 확장 포맷의 스트링으로 변경한다.
(Z가 스트링의 마지막에 붙어있으면 UTC시간이라는 것임)
2022-06-19T05:16:41.582Z

locale

toLocaleString(), toLocaleDateString(), toLocaleTimeString() 이 있다.

Default

  • javascript 엔진이 돌아가는 system에 설정된 timeZone의 offset을 적용한 시간을 각 언어에 맞는 스트링으로 반환한다.

Args

  • 각 메서드의 첫 번째 인자 값으로 언어를 설정할 수 있다.
  • 각 메서드의 두 번째 인자 값으로 timeZone을 설정할 수 있다.
    (인자에 대한 자세한 정보는 MDN을 참고하자)

정리

컴퓨터 시스템에서 시간은 절대적이다.
UTC 시간만 기준이며, UTC 시간만 가지고 있으면 어떤 지역에서라도 시간을 표현할 수 있다.

최근 회사에서 시간관련해서 미리 정해놓지 않은체 프로젝트를 진행해서 이상한 버그가 발생했다. 이에, 제대로 정리를 해야겠다 싶어 이렇게 정리한다.

이 글에 더해 [TIL] UTC, GMT, Locale도 함께 보면 좋다.

profile
Today, I Shoveled AGAIN....

1개의 댓글

comment-user-thumbnail
2022년 9월 2일

오 멋있어요!

답글 달기