JavaScript Academy · 강의

날짜 형식 지정하기

toLocaleDateString 옵션으로 날짜를 표시합니다.

날짜 형식 지정하기은(는) CoddyKit의 무료 JavaScript Academy 강의입니다. 이것은 4개 중 3번째 강의입니다. 아래에서 전체 강의를 무료로 읽을 수 있으며, 내장 코드 에디터와 24/7 AI 튜터와 함께 브라우저에서 직접 실습할 수 있습니다. 이 강의는 JavaScript Academy 학습 경로의 일부이며, 진행 상황이 웹과 CoddyKit 앱에 동기화됩니다. JavaScript Academy 강의에는 총 4개의 강의가 포함되어 있습니다.

날짜 형식 지정하기

JavaScript는 날짜를 읽기 쉬운 텍스트로 바꾸는 여러 내장 메서드를 제공합니다. 지역에 맞춘 출력부터 표준화된 ISO 문자열까지 지원합니다.

const d = new Date(Date.UTC(2024, 0, 15))
console.log(d.toISOString())

toISOString

toISOString은 UTC 기준의 표준화된 문자열을 반환합니다. 모호하지 않으므로 저장과 데이터 교환에 이상적입니다.

const d = new Date(Date.UTC(2024, 0, 15, 10, 30, 0))
console.log(d.toISOString())

ISO 문자열 자르기

ISO 문자열은 날짜를 앞부분에 배치하므로 처음 10자를 잘라 달력 날짜만 얻을 수 있습니다.

const d = new Date(Date.UTC(2024, 0, 15))
console.log(d.toISOString().slice(0, 10))

toLocaleDateString

toLocaleDateString은 지역 설정을 사용하여 날짜 부분의 형식을 지정하고 지역에 맞는 출력을 생성합니다.

const d = new Date(Date.UTC(2024, 0, 15))
const text = d.toLocaleDateString("en-US", { timeZone: "UTC" })
console.log(typeof text)

지역 설정 인수

첫 번째 인수는 en-US나 de-DE와 같은 지역 설정 태그입니다. 이 값에 따라 형식이 지정된 날짜의 순서와 구분 기호가 달라집니다.

const d = new Date(Date.UTC(2024, 0, 15))
const us = d.toLocaleDateString("en-US", { timeZone: "UTC" })
const iso = d.toISOString().slice(0, 10)
console.log(typeof us, iso)

형식 지정 옵션

옵션 객체를 사용하면 긴 월 이름이나 숫자로 된 연도처럼 각 부분이 표시되는 방식을 선택할 수 있습니다.

const d = new Date(Date.UTC(2024, 0, 15))
const text = d.toLocaleDateString("en-US", { year: "numeric", month: "long", day: "numeric", timeZone: "UTC" })
console.log(typeof text)

toLocaleTimeString

toLocaleTimeString은 시간 부분만 형식 지정하며, 사용자가 제공한 지역 설정과 옵션도 반영합니다.

const d = new Date(Date.UTC(2024, 0, 15, 14, 5, 0))
const text = d.toLocaleTimeString("en-US", { timeZone: "UTC" })
console.log(typeof text)

toLocaleString

toLocaleString은 날짜와 시간을 하나의 지역화된 문자열로 결합합니다.

const d = new Date(Date.UTC(2024, 0, 15, 9, 0, 0))
const text = d.toLocaleString("en-US", { timeZone: "UTC" })
console.log(typeof text)

toDateString

toDateString은 지역 설정 옵션 없이 고정된 형식의 읽기 쉬운 영어 날짜를 제공하므로 빠른 기록에 유용합니다.

const d = new Date(Date.UTC(2024, 0, 15))
console.log(typeof d.toDateString())

Intl.DateTimeFormat

반복해서 형식을 지정할 때 Intl.DateTimeFormat은 재사용 가능한 형식 지정 객체를 만듭니다. 지역화 메서드를 여러 번 호출하는 것보다 효율적입니다.

const fmt = new Intl.DateTimeFormat("en-US", { timeZone: "UTC", dateStyle: "medium" })
const d = new Date(Date.UTC(2024, 0, 15))
console.log(typeof fmt.format(d))

형식 선택하기

저장과 API에는 ISO 문자열을 사용하고, 해당 지역의 사용자에게 표시할 때는 지역화 메서드를 사용하십시오. 이 두 용도를 분리하십시오.

const d = new Date(Date.UTC(2024, 0, 15))
console.log(d.toISOString().slice(0, 10))

빠른 확인

형식 지정에 관한 지식을 확인해 보십시오.

복습

복습: 용도에 맞는 형식 지정 메서드를 선택하십시오.

저장과 API에는 toISOString
사용자에게 표시할 때는 toLocaleDateString 및 관련 메서드
옵션으로 월 이름과 숫자 형식을 제어합니다
반복해서 형식을 지정할 때는 Intl.DateTimeFormat이 효율적입니다

const d = new Date(Date.UTC(2024, 0, 15))
console.log(d.toISOString().slice(0, 10))

자주 묻는 질문

“날짜 형식 지정하기” 강의는 무료인가요?

네 — “날짜 형식 지정하기” 전체 내용을 이 웹사이트에서 무료로 읽을 수 있습니다. 인터랙티브하게 실습하려면(내장 코드 에디터와 24/7 AI 튜터), CoddyKit PRO로 업그레이드하면 JavaScript Academy 강의 전체를 잠금 해제할 수 있습니다. JavaScript Academy 강의에는 총 4개의 강의가 포함되어 있습니다.

“날짜 형식 지정하기”에서 뭘 배우나요?

toLocaleDateString 옵션으로 날짜를 표시합니다. 브라우저에서 직접 실행하는 실습 코드로 JavaScript Academy을(를) 배우며, 24/7 AI 튜터가 강의를 진행하면서 질문에 답변해줍니다.

JavaScript Academy을(를) 시작하는 데 경험이 필요한가요?

사전 경험은 필요하지 않습니다. CoddyKit의 JavaScript Academy은(는) 초급자부터 고급 학습자까지를 위해 구성되어 있으므로, 여기서 시작하거나 처음부터 시작할 수 있으며 자신의 속도대로 진행할 수 있습니다. 이것은 4개 중 3번째 강의입니다.

“날짜 형식 지정하기” 강의는 얼마나 걸리나요?

대부분의 CoddyKit 강의는 약 5~10분이 소요됩니다. 각 강의는 간결하고 인터랙티브하여 꾸준한 진행이 가능하며, 웹과 앱에서 중단한 부분부터 바로 시작할 수 있습니다.

이 JavaScript Academy 강의에서 코드를 작성하고 실행할 수 있나요?

네. 모든 JavaScript Academy 강의에는 내장 코드 에디터가 포함되어 있으므로, 브라우저에서 바로 실제 코드를 작성하고 실행한 후 즉시 AI 피드백을 받을 수 있습니다 — 로컬 설정이 필요 없습니다.

이 강의의 모든 강의

← JavaScript Academy(으)로 돌아가기