Intl.NumberFormat
함수는 숫자의 형식을 설정하는 함수로 지정된 지역의 통화 또는 백분율을 표시하는데 사용할 수 있다!
new Intl.NumberFormat('ko-KR', {
notation: 'compact',
maximumFractionDigits: 1,
}).format(1748293952)
// '17.5억'
new Intl.NumberFormat('en-US', {
notation: 'compact',
maximumFractionDigits: 1,
}).format(1748293952)
// '1.7B'
maximumSignificantDigits
프로퍼티는 유효한 숫자를 표시하기 위해 설정할 수 있는 프로퍼티이다. 좀 더 쉽게 설명하자면, "몇 자리까지 반올림할 것인가?"를 설정하는 프로퍼티이다.
유튜브를 만들어보다가 조회 수를 유튜브처럼 표시하고 싶어서 찾아본 메서드이다.
적용한 코드는 이렇다!
<p className="text-slate-500 text-sm">
{new Intl.NumberFormat(
"ko-KR",
{
notation: "compact",
maximumFractionDigits: 1,
maximumSignificantDigits: 3,
}
).format(item.statistics.viewCount)}
회 ∙{timeForToday(item.snippet.publishedAt)}
</p>
결과화면!