JavaScript - 날짜 형식: 초보자 가이드

안녕하세요, JavaScript 개발자 지망생 여러분! 오늘 우리는 JavaScript에서의 fascinatig한 날짜 형식 세계로 뛰어들어 보겠습니다. 코드 한 줄도 작성해 본 적 없다면 걱정하지 마세요 - 이 여정에서 여러분의 친절한 안내자가 되겠습니다. 수년 동안 수많은 학생들을 가르쳐 온 저와 함께 하시면 됩니다. 그럼 커피 한 잔 (또는 차, 당신의 취향에 따라)을 들고, 시작해 보겠습니다!

날짜 형식이란 무엇인가요?

코드로 접근하기 전에, 날짜 형식이 실제로 무엇인지 이야기해 보겠습니다. 특정 순간을 표현하는 다양한 방법으로 생각해 보세요. "2023년 4월 1일" 또는 "4/1/23"로 동일한 날짜를 의미하는 것처럼, 컴퓨터 역시 날짜를 표현하는 여러 가지 방법을 가지고 있습니다.

JavaScript에서는 Date 객체를 내장하고 있어, 날짜와 시간을 다루는 데 도움을 줍니다. 마치 코드 안에 초능력적인 캘린더를 가지고 있는 것과 같습니다!

JavaScript에서 흔히 만나는 날짜 형식

다양한 날짜 형식을 살펴보겠습니다:

1. ISO 날짜 형식

이는 국제 표준 형식입니다. 다음과 같이 보입니다: "YYYY-MM-DD".

let today = new Date();
console.log(today.toISOString().split('T')[0]);

이 예제에서 new Date()는 현재 날짜와 시간의 날짜 객체를 생성합니다. 그런 다음 ISO 형식으로 변환하고, 날짜 부분만 추출합니다. 2023년 4월 1일에 이를 실행하면 "2023-04-01"이 출력됩니다.

2. 짧은 날짜 형식

이는 더 간결한 형식입니다: "MM/DD/YYYY".

let today = new Date();
console.log(today.toLocaleDateString('en-US'));

이는 "4/1/2023"와 같이 출력됩니다.

3. 긴 날짜 형식

이 형식은 월을 단어로 표현합니다: "Month DD, YYYY".

let today = new Date();
console.log(today.toLocaleDateString('en-US', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }));

이는 "Saturday, April 1, 2023"와 같이 출력됩니다.

날짜 객체 생성

이제 몇 가지 형식을 살펴보았으니, 날짜 객체를 생성하는 다양한 방법을 알아보겠습니다:

1. 현재 날짜와 시간

let now = new Date();
console.log(now);

이는 현재 순간의 날짜 객체를 생성합니다.

2. 특정 날짜와 시간

let birthday = new Date('1990-05-15T13:30:00');
console.log(birthday);

이는 1990년 5월 15일 오후 1:30의 날짜 객체를 생성합니다.

3. 개별 구성 요소 사용

let christmas = new Date(2023, 11, 25); // 참고: 월은 0번에서 시작됩니다
console.log(christmas);

이는 2023년 12월 25일의 날짜 객체를 생성합니다 (JavaScript에서 월은 0번에서 시작되므로, 11은 12월을 의미합니다).

날짜 처리

이제 날짜를 생성하는 방법을 알고 있으므로, 몇 가지 일반적인 연산을 살펴보겠습니다:

1. 날짜 구성 요소 가져오기

let today = new Date();
console.log("Year:", today.getFullYear());
console.log("Month:", today.getMonth() + 1); // +1을 더해야 월을 얻을 수 있습니다 (0번에서 시작됩니다)
console.log("Day:", today.getDate());
console.log("Hour:", today.getHours());
console.log("Minute:", today.getMinutes());
console.log("Second:", today.getSeconds());

이는 현재 날짜와 시간의 각 구성 요소를 출력합니다.

2. 날짜 형식화

JavaScript는 날짜를 다양한 방법으로 형식화하는 여러 가지 메서드를 제공합니다:

let date = new Date('2023-04-01T12:00:00');

console.log(date.toDateString()); // "Sat Apr 01 2023"
console.log(date.toTimeString()); // "12:00:00 GMT+0000 (Coordinated Universal Time)"
console.log(date.toLocaleString()); // "4/1/2023, 12:00:00 PM"
console.log(date.toLocaleDateString()); // "4/1/2023"
console.log(date.toLocaleTimeString()); // "12:00:00 PM"

각 메서드는 동일한 날짜의 다른 표현을 제공합니다.

날짜 메서드 표

다음은 몇 가지 일반적인 Date 메서드 표입니다:

메서드	설명	예제
getFullYear()	연도를 가져옵니다 (4자리)	date.getFullYear() // 2023
getMonth()	월을 가져옵니다 (0-11)	date.getMonth() // 3 (4월에 대해)
getDate()	월의 날짜를 가져옵니다 (1-31)	date.getDate() // 1
getDay()	요일을 가져옵니다 (0-6)	date.getDay() // 6 (토요일에 대해)
getHours()	시간을 가져옵니다 (0-23)	date.getHours() // 12
getMinutes()	분을 가져옵니다 (0-59)	date.getMinutes() // 0
getSeconds()	초를 가져옵니다 (0-59)	date.getSeconds() // 0
toDateString()	날짜를 읽기 쉽게 변환합니다	date.toDateString() // "Sat Apr 01 2023"
toTimeString()	시간을 읽기 쉽게 변환합니다	date.toTimeString() // "12:00:00 GMT+0000 (Coordinated Universal Time)"

결론

그렇습니다, 여러분! JavaScript 날짜 형식의 세계를 여행하며, 날짜 객체를 생성하고 다양한 방법으로 형식화하는 방법을 배웠습니다. 날짜를 다루는 것이 처음에는 복잡해 보일 수 있지만, 연습을 통해 빠르게 프로처럼 다룰 수 있을 것입니다.

저는 항상 학생들에게 이야기하듯이, 프로그래밍 개념을 습득하는 열쇠는 실험하는 것입니다. 이 예제들을 시도하고, 수정해 보세요. 실수를 두려워 말아세요 - 그것이 가장 큰 학습의 기회가 될 수 있습니다!

계속 코딩하고, 학습하고, 가장 중요한 것은 즐기세요. 얼마 지나지 않아, 날짜 형식을 친구들에게 설명하는 당신이 될 것입니다 (그들이 듣고 싶든 말든 간에)!

Credits: Image by storyset