JavaScript
The JavaScript toLocaleTimeString method is a function for displaying dates and times in formats specific to a certain region or language.
toLocaleTimeString [method]
toLocaleTimeStringメソッドは、Dateオブジェクトが持つ時間を、特定の地域や言語に適した形式で文字列として表示するために使用されます。これにより、異なる地域のユーザーにとって理解しやすい形で日時を提供できます。
例えば、アメリカ合衆国で一般的に使用される時間の表記方法と、日本で使用される表記方法は異なります。アメリカでは通常、時刻にAMやPMが含まれますが、日本では24時間制が一般的です。toLocaleTimeString を使用すると、これらの地域的な違いを自動で処理し、適切な形式で時刻を表示することができます。
toLocaleTimeStringメソッドの基本的な構文は以下の通りです。
JavaScript
dateObj.toLocaleTimeString([locales[, options]])
ここで、dateObj は JavaScriptの Dateオブジェクトです。
- locales(任意)
- 表示形式の地域を指定する文字列か、その配列です。例えば 'en-US' や 'ja-JP' などがあります。このパラメーターを省略した場合、ブラウザのデフォルトのロケールが使用されます。
- options(任意)
- 日時の表示方法をカスタマイズするためのオプションを指定するオブジェクトです。この中には、時間の表記方式(例:12時間制や24時間制)、時刻に関する情報の表示有無(秒やタイムゾーン)、数字の形式など、多くのプロパティを設定することができます。
toLocaleTimeStringメソッドで使用可能な optionsオブジェクトの主なプロパティとその説明は以下の通りです。
- localeMatcher
- ロケールのマッチングアルゴリズムを指定します。値としては "lookup" や "best fit" があり、これはロケールの選択方法を指定します。
- hour12
- 12時間制(AM/PM 表示)か24時間制かを指定します。値としては true または false が指定可能です。
- hour
- 時を表示するかどうか、またその形式を指定します。値として "numeric"、"2-digit" が使用できます。
- minute
- 分を表示するかどうか、またその形式を指定します。値として "numeric"、"2-digit" が使用できます。
- second
- 秒を表示するかどうか、またその形式を指定します。値として "numeric"、"2-digit" が使用できます。
- timeZoneName
- タイムゾーンを表示するかどうかを指定します。値として "short" または "long" が使用でき、それぞれ短い形式や長い形式でタイムゾーンを表示します。
- timeZone
- 使用するタイムゾーンを指定します。例えば "Asia/Tokyo" や "America/New_York" など、有効な IANA タイムゾーン名を指定します。
- formatMatcher
- 日付と時間の形式を選択する方法を指定します。値として "basic" や "best fit" があります。
Sample
現在の時刻を取得し、それを日本とアメリカのそれぞれの時間形式で表示します。
Loading...
Loading...
HTML
<p id="timeJapan">Loading...</p>
<p id="timeUSA">Loading...</p>
<script>
// Write here JavaScript
</script>
JavaScript
function updateTime() {
const now = new Date();
document.getElementById('timeJapan').textContent = '日本の時間形式: ' + now.toLocaleTimeString('ja-JP');
document.getElementById('timeUSA').textContent = 'アメリカの時間形式: ' + now.toLocaleTimeString('en-US');
}
// 初期表示と1秒ごとに更新
updateTime();
setInterval(updateTime, 1000);
このように、toLocaleTimeString メソッドを利用することで、様々な地域のユーザーに合わせた日時の表示が可能となり、国際的なウェブアプリケーションの開発において非常に便利です。