aboutsummaryrefslogtreecommitdiff
path: root/files/ja/web/javascript/reference/global_objects/date/tolocaledatestring/index.html
blob: 8c5470ef50e42372693e9433512f7e475df72c48 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
---
title: Date.prototype.toLocaleDateString()
slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
tags:
  - Date
  - IANA Timezone Format
  - Internationalization
  - JavaScript
  - Method
  - Prototype
  - Reference
translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
---
<div>{{JSRef}}</div>

<p><strong><code>toLocaleDateString()</code></strong> メソッドは、この Date オブジェクトの「日付」部を表す言語に依存した文字列を返します。新しい <code>locales</code> 引数と <code>options</code> 引数により、アプリケーションは、使用される書式変換の言語の指定や、関数の振る舞いのカスタマイズができます。古い実装のアプリケーションは、<code>locales</code> 引数と <code>options</code> 引数を無視します。使用されるロケールや返される文字列の書式は、完全に実装依存です。</p>

<div>{{EmbedInteractiveExample("pages/js/date-tolocaledatestring.html")}}</div>

<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>

<h2 id="Syntax" name="Syntax">構文</h2>

<pre class="syntaxbox notranslate"><var>dateObj</var>.toLocaleDateString([<var>locales</var>[, <var>options</var>]])</pre>

<h3 id="Parameters" name="Parameters">引数</h3>

<p><code>locales</code> 引数と <code>options</code> 引数をサポートしているブラウザーは、{{anch("Browser compatibility", "ブラウザーの実装状況")}} セクションを確認してください。機能が使用できるかどうかは、{{anch("Checking_for_support_for_locales_and_options_arguments", "locales 引数と options 引数がサポートされているか確認する")}}で確認してください。</p>

<p>See the <a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/DateTimeFormat"><code>Intl.DateTimeFormat()</code> constructor</a> for details on these parameters and how to use them.</p>

<p>日時のそれぞれの部分ののプロパティにおける既定値は、{{jsxref("undefined")}}です。ただし、<code>weekday</code><code>year</code><code>month</code><code>day</code> プロパティがすべて {{jsxref("undefined")}} のときは、<code>year</code><code>month</code><code>day</code><code>"numeric"</code> とみなされます。</p>

<h3 id="Return_value" name="Return_value">返値</h3>

<p>与えられた {{jsxref("Global_Objects/Date", "Date")}} インスタンスの「日付」部を表す、言語特有の慣習による文字列。</p>

<h2 id="Performance" name="Performance">性能</h2>

<p>大量の日付を書式化する場合は、 {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} オブジェクトを生成してその {{jsxref("DateTimeFormat.prototype.format", "format")}} プロパティで提供される関数を使用したほうが得策です。</p>

<h2 id="Examples" name="Examples"></h2>

<h3 id="Using_toLocaleDateString" name="Using_toLocaleDateString">toLocaleDateString() の使用</h3>

<p>ロケールを指定しない基本的な使い方では、既定のロケールと既定のオプションによる書式の文字列が返されます。</p>

<pre class="brush: js notranslate">var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));

// toLocaleDateString() に引数を与えなければ実装に依存し、
// 既定のロケールとタイムゾーンを返す
console.log(date.toLocaleDateString());
// → "12/11/2012" : アメリカ/ロサンゼルスのタイムゾーンの en-US ロケールで実行した場合
</pre>

<h3 id="Checking_for_support_for_locales_and_options_arguments" name="Checking_for_support_for_locales_and_options_arguments">locales と options の各引数に対応しているか確認する</h3>

<p><code>locales</code> および <code>options</code> 引数は、まだすべてのブラウザーが対応しているわけではありません。これらが実装されているかどうかをチェックするには、不適切な言語タグを与えると {{jsxref("RangeError")}} 例外で拒否されるという要件を使用することができます。</p>

<pre class="brush: js notranslate">function toLocaleDateStringSupportsLocales() {
  try {
    new Date().toLocaleDateString('i');
  } catch (e) {
    return e.name !== 'RangeError';
  }
  return true;
}
</pre>

<h3 id="Using_locales" name="Using_locales">locales の使用</h3>

<p>この例では、国ごとに異なる日付書式を示します。アプリケーションのユーザーインターフェイスで使用されている言語の書式を得るには、 <code>locales</code> 引数でその言語 (あるいはフォールバック先の言語) を指定してください。</p>

<pre class="brush: js notranslate">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

// 以下の書式はその地域のタイムゾーンとロケールを想定
// 米国のアメリカ大陸/ロサンゼルス

// 米国英語は月-日-年の順
console.log(date.toLocaleDateString('en-US'));
// → "12/19/2012"

// 英国英語は日-月-年の順
console.log(date.toLocaleDateString('en-GB'));
// → "20/12/2012"

// 韓国は年-月-日の順
console.log(date.toLocaleDateString('ko-KR'));
// → "2012. 12. 20."

// Event for Persian, It's hard to manually convert date to Solar Hijri
console.log(date.toLocaleDateString('fa-IR'));
// → "۱۳۹۱/۹/۳۰"

// 多くのアラビア語圏ではアラビア数字
console.log(date.toLocaleDateString('ar-EG'));
// → "<span dir="rtl">٢٠‏/١٢‏/٢٠١٢</span>"

// 日本語では、アプリケーションは元号を用いることがある
// 2012 年は平成 24 年
console.log(date.toLocaleDateString('ja-JP-u-ca-japanese'));
// → "24/12/20"

// 対応していない可能性のある言語を要求した場合、例えば
// バリ語とし、フォールバック言語にインドネシア語を指定した場合
console.log(date.toLocaleDateString(['ban', 'id']));
// → "20/12/2012"
</pre>

<h3 id="Using_options" name="Using_options">options の使用</h3>

<p><code>toLocaleDateString()</code> メソッドから得られる結果は、 <code>options</code> 引数でカスタマイズできます。</p>

<pre class="brush: js notranslate">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

// 曜日を加えて月とともに長い書式で表す
var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
console.log(date.toLocaleDateString('de-DE', options));
// → "Donnerstag, 20. Dezember 2012"

// アプリケーションで UTC を用いてそれを示したい場合
options.timeZone = 'UTC';
options.timeZoneName = 'short';
console.log(date.toLocaleDateString('en-US', options));
// → "Thursday, December 20, 2012, GMT"
</pre>

<h2 id="Specifications" name="Specifications">仕様書</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">仕様書</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-date.prototype.tolocaletimestring', 'Date.prototype.toLocaleTimeString')}}</td>
  </tr>
  <tr>
   <td>{{SpecName('ES Int Draft', '#sup-date.prototype.tolocaletimestring', 'Date.prototype.toLocaleTimeString')}}</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>

<p>{{Compat("javascript.builtins.Date.toLocaleDateString")}}</p>

<h2 id="See_also" name="See_also">関連情報</h2>

<ul>
 <li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
 <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
 <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li>
 <li>{{jsxref("Date.prototype.toString()")}}</li>
</ul>