diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/ja/web/javascript/reference/global_objects/intl/relativetimeformat | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/ja/web/javascript/reference/global_objects/intl/relativetimeformat')
4 files changed, 434 insertions, 0 deletions
diff --git a/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/format/index.html b/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/format/index.html new file mode 100644 index 0000000000..8529542ad8 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/format/index.html @@ -0,0 +1,109 @@ +--- +title: Intl.RelativeTimeFormat.prototype.format() +slug: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat/format +tags: + - IntI + - Internationalization + - JavaScript + - Method + - Reference + - RelativeTimeFormat +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat/format +--- +<div>{{JSRef}}</div> + +<p><strong><code>Intl.RelativeTimeFormat.prototype.format()</code></strong> メソッドは <code>value</code> や <code>unit</code> を、この {{jsxref("Intl.RelativeTimeFormat")}} オブジェクトのロケールと整形オプションに従って整形します。</p> + +<div>{{EmbedInteractiveExample("pages/js/intl-relativetimeformat-prototype-format.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="brush: js notranslate"><var>relativeTimeFormat</var>.format(<var>value</var>, <var>unit</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>value</var></code></dt> + <dd>国際化された相対時間のメッセージに使用する数値です。</dd> +</dl> + +<dl> + <dt><code><var>unit</var></code></dt> + <dd>国際化された相対時間のメッセージに使用する単位です。利用可能な値は、 "<code>year</code>", "<code>quarter</code>", "<code>month</code>", "<code>week</code>", "<code>day</code>", "<code>hour</code>", "<code>minute</code>", "<code>second</code>" です。複数形も許容されています。</dd> +</dl> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>format</code> ゲッター関数は、この {{jsxref("RelativeTimeFormat", "Intl.RelativeTimeFormat")}} オブジェクトのロケールと整形オプションに従って値や単位を整形し、文字列に格納します。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Basic_format_usage" name="Basic_format_usage">基本的な format の使い方</h3> + +<p>以下の例は、英語を使用した相対時間のフォーマッターの生成方法を示しています。</p> + +<pre class="brush: js notranslate">// ロケールで既定値を明確に指定して +// 相対時間フォーマッターを作成 +const rtf = new Intl.RelativeTimeFormat("en", { + localeMatcher: "best fit", // other values: "lookup" + numeric: "always", // other values: "auto" + style: "long", // other values: "short" or "narrow" +}); + +// 負の値 (-1) を使った相対時間の書式化 +rtf.format(-1, "day"); +// > "1 day ago" + +// 正の値 (1) を使った相対時間の書式化 +rtf.format(1, "day"); +// > "in 1 day"</pre> + +<h3 id="Using_the_auto_option" name="Using_the_auto_option">auto オプションの使用</h3> + +<p><code>numeric:auto</code> オプションが渡された場合は、 <code>1 day ago</code> や <code>in 1 day</code> の代わりに <code>yesterday</code> や <code>tomorrow</code> の文字列が生成されます。これにより、出力に数値が含まれなくなることがあります。</p> + +<pre class="brush: js notranslate">// ロケールで既定値を明確に指定して +// 相対時間フォーマッターを作成 +const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" }); + +// 負の値 (-1) を使った相対時間の書式化 +rtf.format(-1, "day"); +// > "yesterday" + +// 正の値 (1) を使った相対時間の書式化 +rtf.format(1, "day"); +// > "tomorrow" +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ES Int Draft', '#sec-Intl.RelativeTimeFormat.prototype.format', 'RelativeTimeFormat.format()')}}</td> + <td>第 4 段階</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.Intl.RelativeTimeFormat.format")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("Intl.RelativeTimeFormat")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/formattoparts/index.html b/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/formattoparts/index.html new file mode 100644 index 0000000000..01aea3d1f9 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/formattoparts/index.html @@ -0,0 +1,91 @@ +--- +title: Intl.RelativeTimeFormat.prototype.formatToParts() +slug: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat/formatToParts +tags: + - Internationalization + - Intl + - JavaScript + - Method + - Prototype + - RelativeTimeFormat +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat/formatToParts +--- +<div>{{JSRef}}</div> + +<p><strong><code>Intl.RelativeTimeFormat.prototype.formatToParts()</code></strong> メソッドは、ロケールを考慮したカスタム書式設定に使用できる相対時間書式を部品単位で表すオブジェクトの配列 ({{jsxref("Array")}}) を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/intl-relativetimeformat-prototype-formattoparts.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="brush: js notranslate">RelativeTimeFormat.formatToParts(<var>value</var>, <var>unit</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>value</var></code></dt> + <dd>国際化された相対時間のメッセージに使用する数値です。</dd> +</dl> + +<dl> + <dt><code><var>unit</var></code></dt> + <dd>国際化された相対時間のメッセージに使用する単位です。利用可能な値は、 "<code>year</code>", "<code>quarter</code>", "<code>month</code>", "<code>week</code>", "<code>day</code>", "<code>hour</code>", "<code>minute</code>", "<code>second</code>" です。複数形も許容されています。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>書式化された相対時間を部品単位で含むオブジェクトの配列 ({{jsxref("Array")}}) です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<div><code>Intl.RelativeTimeFormat.prototype.formatToParts</code> メソッドは、書式化メソッドのバージョンの一つで、書式化された数値を他の周囲のテキストから分離し、それぞれの構成部品に分解した、オブジェクトの「部分」を表すオブジェクトの配列を返すものです。これらのオブジェクトには二つのプロパティがあります。 type は <code>NumberFormat</code> の formatToParts 型で、値は出力の構成要素である文字列です。もし "part" が <code>NumberFormat</code> から来たものであれば、書式化された単位を示す unit プロパティを持ちます。</div> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_formatToParts" name="Using_formatToParts">formatToParts の使用</h3> + +<pre class="brush: js notranslate">const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" }); + +// Format relative time using the day unit +rtf.formatToParts(-1, "day"); +// > [{ type: "literal", value: "yesterday"}] + +rtf.formatToParts(100, "day"); +// > [{ type: "literal", value: "in " }, +// > { type: "integer", value: "100", unit: "day" }, +// > { type: "literal", value: " days" }]</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ES Int Draft', '#sec-Intl.RelativeTimeFormat.prototype.formatToParts', 'RelativeTimeFormat.formatToParts()')}}</td> + <td>第 4 段階</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div> +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.Intl.RelativeTimeFormat.format")}}</p> +</div> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("Intl.RelativeTimeFormat")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/index.html b/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/index.html new file mode 100644 index 0000000000..1e774a8b10 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/index.html @@ -0,0 +1,112 @@ +--- +title: Intl.RelativeTimeFormat +slug: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat +tags: + - Class + - Internationalization + - Intl + - JavaScript + - RelativeTimeFormat +translation_of: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat +--- +<div>{{JSRef}}</div> + +<p><strong><code>Intl.RelativeTimeFormat</code></strong> オブジェクトは言語に依存の相対時間の書式化を可能にします。</p> + +<div>{{EmbedInteractiveExample("pages/js/intl-relativetimeformat.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力していただける場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Constructor" name="Constructor">コンストラクター</h2> + +<dl> + <dt>{{jsxref("Intl/RelativeTimeFormat/RelativeTimeFormat", "Intl.RelativeTimeFormat.RelativeTimeFormat()")}}</dt> + <dd>新しい <code>Intl.RelativeTimeFormat</code> オブジェクトを生成します。</dd> +</dl> + +<h2 id="Static_methods" name="Static_methods">静的メソッド</h2> + +<dl> + <dt>{{jsxref("Intl/RelativeTimeFormat/supportedLocalesOf", "Intl.RelativeTimeFormat.supportedLocalesOf()")}}</dt> + <dd>指定されたロケールのうち、実行時の既定のロケールにフォールバックせずに対応されるものを配列に収めて返します。</dd> +</dl> + +<h2 id="Instance_methods" name="Instance_methods">インスタンスメソッド</h2> + +<dl> + <dt>{{jsxref("Intl/RelativeTimeFormat/format", "Intl.RelativeTimeFormat.prototype.format()")}}</dt> + <dd><code>value</code> および <code>unit</code> を、指定された {{jsxref("Intl.RelativeTimeFormat")}} オブジェクトのロケールと書式化オプションに従って書式化します。</dd> + <dt>{{jsxref("Intl/RelativeTimeFormat/formatToParts", "Intl.RelativeTimeFormat.prototype.formatToParts()")}}</dt> + <dd>ロケール固有のカスタムフォーマットに使用可能な相対時間のフォーマットを部分的に表現したオブジェクトの {{jsxref("Array")}} を返します。</dd> + <dt>{{jsxref("Intl/RelativeTimeFormat/resolvedOptions", "Intl.RelativeTimeFormat.prototype.resolvedOptions()")}}</dt> + <dd>オブジェクトの初期化中に計算されたロケールやフォーマットのオプションを反映したプロパティを持つ新しいオブジェクトを返します。</dd> +</dl> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Basic_format_usage" name="Basic_format_usage">基本的な <code>format</code> の使用例</h3> + +<p>以下は英語の相対時間フォーマッターの使い方の例です。</p> + +<pre class="brush: js notranslate">// 明示的に渡された既定値を使って +// ロケールの相対時間を生成します +const rtf = new Intl.RelativeTimeFormat("en", { + localeMatcher: "best fit", // other values: "lookup" + numeric: "always", // other values: "auto" + style: "long", // other values: "short" or "narrow" +}); + +// 負数の値 (-1) を使った相対時間のフォーマット +rtf.format(-1, "day"); +// > "1 day ago" + +// 正数の値 (1) を使った相対時間のフォーマット +rtf.format(1, "day"); +// > "in 1 day"</pre> + +<h3 id="Using_formatToParts" name="Using_formatToParts">formatToParts の使用例</h3> + +<p>以下はフォーマットされた部品を返す相対時間フォーマッターの生成方法の例です。</p> + +<pre class="brush: js notranslate">const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" }); + +// 日単位の相対時間フォーマット +rtf.formatToParts(-1, "day"); +// > [{ type: "literal", value: "yesterday"}] + +rtf.formatToParts(100, "day"); +// > [{ type: "literal", value: "in " }, +// > { type: "integer", value: "100", unit: "day" }, +// > { type: "literal", value: " days" }] +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ES Int Draft', '#relativetimeformat-objects', 'RelativeTimeFormat')}}</td> + <td>第 4 段階</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.Intl.RelativeTimeFormat")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="https://developers.google.com/web/updates/2018/10/intl-relativetimeformat">The Intl.RelativeTimeFormat API</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/relativetimeformat/index.html b/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/relativetimeformat/index.html new file mode 100644 index 0000000000..fdc22fa753 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/intl/relativetimeformat/relativetimeformat/index.html @@ -0,0 +1,122 @@ +--- +title: Intl.RelativeTimeFormat() コンストラクター +slug: >- + Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat/RelativeTimeFormat +tags: + - Constructor + - Internationalization + - Intl + - JavaScript + - Reference + - RelativeTimeFormat +translation_of: >- + Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat/RelativeTimeFormat +--- +<div>{{JSRef}}</div> + +<p><strong><code>Intl.RelativeTimeFormat()</code></strong> コンストラクターは、 {{jsxref("Intl/RelativeTimeFormat", "Intl.RelativeTimeFormat")}} オブジェクトを生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="notranslate">new Intl.RelativeTimeFormat([<var>locales</var>[, <var>options</var>]])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>locales</var></code> {{optional_inline}}</dt> + <dd> + <p>BCP 47 言語タグを持つ文字列か、そのような文字列の配列です。 <code>locales</code> 引数の一般的な形式と解釈については、 {{jsxref("Global_Objects/Intl", "Intl ページ", "#Locale_identification_and_negotiation", 1)}}を参照してください。</p> + </dd> + <dt><code><var>options</var></code> {{optional_inline}}</dt> + <dd>以下のプロパティのうち一部またはすべてを持つオブジェクトです。 + <dl> + <dt><code>localeMatcher</code></dt> + <dd>使用するロケールの一致アルゴリズムです。指定可能な値は <code>lookup</code> および <code>best fit</code> で、既定値は <code>best fit</code> です。このオプションの詳細は、 {{jsxref("Global_Objects/IntlIntl", "Intl", "#Locale_negotiation")}} を参照してください。</dd> + <dt><code>numeric</code></dt> + <dd>メッセージを出力する書式です。利用可能な値は次の通りです。 + <ul> + <li>"<code>always</code>" (既定値、例えば <code>1 日前</code>)</li> + <li>"<code>auto</code>" (例えば <code>昨日</code>)。 "<code>auto</code>" にすると、出力に常に数値が入るとは限りません。</li> + </ul> + </dd> + <dt><code>style</code></dt> + <dd>国際化されたメッセージの長さです。利用可能な値は次の通りです。 + <ul> + <li>"<code>long</code>" (既定値、例えば <code>in 1 month</code>)</li> + <li>"<code>short</code>" (例えば <code>in 1 mo.</code>)</li> + <li>"<code>narrow</code>" (例えば <code>in 1 mo.</code>) narrow スタイルは同じロケールでは short スタイルと同様になることがあります。</li> + </ul> + </dd> + </dl> + </dd> +</dl> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Basic_format_usage" name="Basic_format_usage">基本的な書式の使い方</h3> + +<p>以下の例は、英語を使用した相対時間のフォーマッターの生成方法を示しています。</p> + +<pre class="brush: js notranslate">// Create a relative time formatter in your locale +// with default values explicitly passed in. +const rtf = new Intl.RelativeTimeFormat("en", { + localeMatcher: "best fit", // other values: "lookup" + numeric: "always", // other values: "auto" + style: "long", // other values: "short" or "narrow" +}); + +// 負の値 (-1) を使った相対時間のフォーマット +rtf.format(-1, "day"); +// > "1 day ago" + +// 正の値 (1) を使った相対時間のフォーマット +rtf.format(1, "day"); +// > "in 1 day"</pre> + +<h3 id="Using_the_auto_option" name="Using_the_auto_option">auto オプションの使用</h3> + +<p><code>numeric:auto</code> オプションが渡された場合は、 <code>1 day ago</code> や <code>in 1 day</code> の代わりに <code>yesterday</code> や <code>tomorrow</code> の文字列が生成されます。これにより、出力に数値が含まれなくなることがあります。</p> + +<pre class="brush: js notranslate">// Create a relative time formatter in your locale +// with numeric: "auto" option value passed in. +const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" }); + +// Format relative time using negative value (-1). +rtf.format(-1, "day"); +// > "yesterday" + +// Format relative time using positive day unit (1). +rtf.format(1, "day"); +// > "tomorrow" +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">状態</th> + <th scope="col">備考</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ES Int Draft', '#sec-intl-relativetimeformat-constructor', 'RelativeTimeFormat()')}}</td> + <td>第 4 段階</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.Intl.RelativeTimeFormat.RelativeTimeFormat")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="https://developers.google.com/web/updates/2018/10/intl-relativetimeformat">The Intl.RelativeTimeFormat API</a></li> +</ul> |