밀리초 또는 마이크로초를 시간에 어떻게 표시하나요?
Intl.DateTimeFormat을 사용하여 시간 표시에서 초 이하의 정밀도를 표시하세요
소개
대부분의 시간 표시는 시간, 분, 초를 보여줍니다. 이러한 정밀도는 일정, 약속 및 일상적인 시간 측정에 적합합니다. 그러나 일부 애플리케이션에서는 초의 십분의 일, 백분의 일 또는 천분의 일을 표시하기 위해 초 미만의 정밀도가 필요합니다.
성능 모니터링 도구는 응답 시간을 밀리초 단위로 표시합니다. 과학 애플리케이션은 초 미만의 정밀도로 측정값을 표시합니다. 비디오 및 오디오 애플리케이션은 밀리초 단위까지 타임스탬프를 표시합니다. 로깅 시스템은 밀접하게 발생하는 이벤트를 구분하기 위해 초 단위의 소수점 타임스탬프로 이벤트를 기록합니다.
JavaScript의 Intl.DateTimeFormat은 초 미만의 정밀도를 표시하기 위한 fractionalSecondDigits 옵션을 제공합니다. 이 수업에서는 소수점 초가 무엇인지, 어떻게 표시하는지, 그리고 언제 이 수준의 정밀도가 필요한지 설명합니다.
소수점 초 정밀도 이해하기
초는 시간 측정의 기본 단위입니다. 소수점 초는 한 초보다 작은 시간의 부분을 나타냅니다.
1초의 십분의 일은 0.1초이며, 이는 100밀리초와 같습니다. 이 정밀도는 십분의 일초 내에 발생하는 이벤트를 구분할 수 있습니다.
1초의 백분의 일은 0.01초이며, 이는 10밀리초와 같습니다. 이 정밀도는 백분의 일초 내에 발생하는 이벤트를 구분할 수 있습니다.
1초의 천분의 일은 0.001초이며, 이는 1밀리초와 같습니다. 이것은 Intl.DateTimeFormat이 지원하는 가장 높은 정밀도입니다.
JavaScript는 소수점 이하 자릿수로 소수점 초를 표현합니다. 한 자리는 십분의 일을, 두 자리는 백분의 일을, 세 자리는 천분의 일을 보여줍니다.
마이크로초에 대하여
수업 제목에는 마이크로초가 언급되어 있지만, Intl.DateTimeFormat은 마이크로초 정밀도를 지원하지 않습니다. 마이크로초는 백만분의 일초를 나타내며 소수점 이하 여섯 자리가 필요합니다. API는 최대 세 자리까지만 지원하므로 밀리초 정밀도만 제공합니다.
JavaScript Date 객체는 내부적으로 1970년 1월 1일 UTC 이후의 밀리초로 시간을 저장합니다. 이는 기본 데이터가 밀리초 정밀도는 지원하지만 마이크로초 정밀도는 지원하지 않는다는 것을 의미합니다.
fractionalSecondDigits 옵션 사용하기
fractionalSecondDigits 옵션은 초 필드의 소수점 이하 자릿수를 제어합니다. 1, 2 또는 3의 값을 허용합니다.
fractionalSecondDigits를 사용할 때는 반드시 second 옵션을 포함해야 합니다. second 옵션이 없으면 포맷터는 초 필드를 완전히 생략하므로 소수 초 옵션이 아무런 효과가 없습니다.
const date = new Date('2025-10-15T14:23:45.678');
const formatter = new Intl.DateTimeFormat('en-US', {
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
fractionalSecondDigits: 3
});
console.log(formatter.format(date));
// 출력: "2:23:45.678 PM"
이 포맷터는 시간, 분, 초 및 소수점 이하 3자리를 표시합니다. Date 객체는 밀리초 정밀도를 포함하며, 포맷터는 모든 3자리를 표시합니다.
소수점 이하 한 자리 표시하기
'fractionalSecondDigits'를 1로 설정하면 초의 10분의 1 단위를 표시합니다.
const date = new Date('2025-10-15T14:23:45.678');
const formatter = new Intl.DateTimeFormat('en-US', {
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
fractionalSecondDigits: 1
});
console.log(formatter.format(date));
// 출력: "2:23:45.6 PM"
포맷터는 값을 소수점 이하 한 자리로 반올림합니다. 원래 값은 678 밀리초를 포함하며, 이는 0.678초와 같습니다. 한 자리로 표시할 때 0.6초로 내림됩니다.
소수점 이하 두 자리 표시하기
'fractionalSecondDigits'를 2로 설정하면 초의 100분의 1 단위를 표시합니다.
const date = new Date('2025-10-15T14:23:45.678');
const formatter = new Intl.DateTimeFormat('en-US', {
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
fractionalSecondDigits: 2
});
console.log(formatter.format(date));
// 출력: "2:23:45.67 PM"
포맷터는 값을 소수점 이하 두 자리로 반올림합니다. 678 밀리초는 0.678초와 같으며, 두 자리로 표시할 때 0.67초로 내림됩니다.
소수점 이하 세 자리 표시하기
fractionalSecondDigits를 3으로 설정하면 초의 천분의 일, 즉 밀리초를 표시합니다.
const date = new Date('2025-10-15T14:23:45.678');
const formatter = new Intl.DateTimeFormat('en-US', {
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
fractionalSecondDigits: 3
});
console.log(formatter.format(date));
// 출력: "2:23:45.678 PM"
이는 JavaScript Date 객체에서 사용 가능한 전체 밀리초 정밀도를 표시합니다. 3자리가 Intl.DateTimeFormat에서 지원하는 최대 정밀도입니다.
24시간 시간 형식과 결합하기
소수 초는 24시간 시간 형식을 포함한 모든 시간 형식 옵션과 함께 작동합니다.
const date = new Date('2025-10-15T14:23:45.678');
const formatter = new Intl.DateTimeFormat('en-GB', {
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
fractionalSecondDigits: 3,
hourCycle: 'h23'
});
console.log(formatter.format(date));
// 출력: "14:23:45.678"
영국 영어 로케일은 기본적으로 24시간 시간을 사용하며, hourCycle 옵션은 24시간 형식을 보장합니다. 소수 초는 초 뒤에 소수점 구분자와 함께 표시됩니다.
소수 초와 함께 시간대 포함하기
소수 초를 시간대 정보와 함께 표시할 수 있습니다.
const date = new Date('2025-10-15T14:23:45.678Z');
const formatter = new Intl.DateTimeFormat('en-US', {
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
fractionalSecondDigits: 3,
timeZone: 'America/New_York',
timeZoneName: 'short'
});
console.log(formatter.format(date));
// 출력: "10:23:45.678 AM EDT"
이 포맷터는 UTC 시간을 뉴욕 시간으로 변환하고 밀리초 정밀도와 시간대 약어와 함께 결과를 표시합니다.
로케일 간 소수 초 형식 지정 방법
다양한 로케일은 숫자에 대해 서로 다른 소수점 구분자를 사용하지만, 소수 초는 모든 로케일에서 일관되게 마침표를 소수점 구분자로 사용합니다.
const date = new Date('2025-10-15T14:23:45.678');
const options = {
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
fractionalSecondDigits: 3
};
const en = new Intl.DateTimeFormat('en-US', options);
console.log(en.format(date));
// 출력: "2:23:45.678 PM"
const de = new Intl.DateTimeFormat('de-DE', options);
console.log(de.format(date));
// 출력: "14:23:45.678"
const fr = new Intl.DateTimeFormat('fr-FR', options);
console.log(fr.format(date));
// 출력: "14:23:45.678"
const ar = new Intl.DateTimeFormat('ar-SA', options);
console.log(ar.format(date));
// 출력: "٢:٢٣:٤٥٫٦٧٨ م"
영어는 AM/PM이 있는 12시간 형식을 사용합니다. 독일어와 프랑스어는 24시간 형식을 사용합니다. 아랍어는 아랍-인도 숫자를 사용하지만 동일한 시간 형식 구조를 유지합니다. 모든 로케일은 소수 초에 대해 마침표 또는 유사한 구분자를 사용합니다.
소수 초의 일반적인 사용 사례
성능 모니터링은 밀리초 정밀도로 응답 시간을 표시합니다.
const startTime = new Date();
// 작업 수행
const endTime = new Date();
const formatter = new Intl.DateTimeFormat('en-US', {
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
fractionalSecondDigits: 3,
hourCycle: 'h23'
});
console.log(`Operation completed at ${formatter.format(endTime)}`);
// 출력: "Operation completed at 14:23:45.678"
이는 성능 분석을 위해 밀리초 정밀도로 정확한 완료 시간을 표시합니다.
과학적 데이터 로깅은 초 미만의 타임스탬프가 필요합니다.
function logMeasurement(value) {
const timestamp = new Date();
const formatter = new Intl.DateTimeFormat('en-US', {
year: 'numeric',
month: '2-digit',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
fractionalSecondDigits: 3,
hourCycle: 'h23'
});
console.log(`${formatter.format(timestamp)} - Measurement: ${value}`);
}
logMeasurement(23.5);
// 출력: "10/15/2025, 14:23:45.678 - Measurement: 23.5"
이는 과학적 측정을 위해 밀리초 정밀도의 타임스탬프를 생성합니다.
비디오 플레이어 타임스탬프는 초 미만의 정밀도로 위치를 표시합니다.
function formatVideoTimestamp(milliseconds) {
const date = new Date(milliseconds);
const formatter = new Intl.DateTimeFormat('en-US', {
minute: '2-digit',
second: '2-digit',
fractionalSecondDigits: 2,
hourCycle: 'h23',
timeZone: 'UTC'
});
return formatter.format(date);
}
console.log(formatVideoTimestamp(125678));
// 출력: "02:05.67"
이는 비디오 타임스탬프를 1/100초 정밀도로 포맷합니다. 시간대를 UTC로 설정하면 지속 시간 값에 대한 시간대 변환이 방지됩니다.
소수 초를 사용해야 하는 경우
동일한 초 내에 발생하는 이벤트를 구분해야 할 때 소수 초를 사용하세요. 성능 모니터링, 디버깅, 과학적 측정 및 미디어 애플리케이션은 일반적으로 이러한 정밀도가 필요합니다.
일상적인 시간 기록에는 소수 초를 사용하지 마세요. 약속, 일정 및 사용자 대면 타임스탬프는 거의 초 미만의 정밀도가 필요하지 않습니다. 불필요한 정밀도를 추가하면 시간을 읽고 이해하기 어려워집니다.
필요에 맞는 적절한 자릿수를 선택하세요. 한 자리는 많은 사용 사례에 충분한 정밀도를 제공하면서도 가독성을 유지합니다. 세 자리는 최대 정밀도를 제공하지만 더 길고 기술적으로 보이는 타임스탬프를 생성합니다.
요약
fractionalSecondDigits 옵션은 시간 형식에서 초 이하의 정밀도를 표시합니다. 1, 2 또는 3의 값을 사용하여 10분의 1초, 100분의 1초 또는 1000분의 1초를 표시할 수 있습니다. fractionalSecondDigits를 사용할 때는 반드시 second 옵션을 포함해야 합니다.
자바스크립트의 Intl.DateTimeFormat은 밀리초 정밀도를 지원하지만 마이크로초 정밀도는 지원하지 않습니다. 세 자리의 소수 자릿수는 밀리초를 나타내며, 이는 사용 가능한 가장 높은 정밀도입니다.
소수 초는 12시간 및 24시간 형식, 시간대 및 다양한 로케일을 포함한 모든 시간 형식 옵션과 함께 작동합니다. 소수 초의 소수점 구분 기호는 모든 로케일에서 일관되게 유지됩니다.
성능 모니터링, 과학 데이터, 디버깅 로그 및 미디어 타임스탬프에는 소수 초를 사용하세요. 초 단위 정밀도로 충분한 일상적인 시간 측정에서는 소수 초를 사용하지 마세요.