Functions/get を更新

- Markdown に変換
- 2021/09/18 時点の英語版に同期

1 files changed, 111 insertions, 95 deletions

diff --git a/files/ja/web/javascript/reference/functions/get/index.md b/files/ja/web/javascript/reference/functions/get/index.md
index d521b6b898..d2453d83ab 100644
--- a/files/ja/web/javascript/reference/functions/get/index.md
+++ b/files/ja/web/javascript/reference/functions/get/index.md
@@ -4,56 +4,66 @@ slug: Web/JavaScript/Reference/Functions/get
 tags:
   - ECMAScript 2015
   - ECMAScript 5
-  - Functions
+  - 関数
   - JavaScript
-  - Language feature
   - 言語機能
-  - 関数
+  - リファレンス
+browser-compat: javascript.functions.get
 translation_of: Web/JavaScript/Reference/Functions/get
 ---
-<div>{{jsSidebar("Functions")}}</div>
-
-<p><strong><code>get</code></strong> 構文は、オブジェクトのプロパティを関数に結びつけ、プロパティが参照された時に関数が呼び出されるようにします。</p>
+{{jsSidebar("Functions")}}
 
-<div>{{EmbedInteractiveExample("pages/js/functions-getter.html")}}</div>
+**`get`** 構文は、オブジェクトのプロパティを関数に結びつけ、プロパティが参照された時に関数が呼び出されるようにします。
 
-<p class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</p>
+{{EmbedInteractiveExample("pages/js/functions-getter.html")}}
 
-<h2 id="Syntax" name="Syntax">構文</h2>
+## 構文
 
-<pre class="syntaxbox">{get <var>prop</var>() { ... } }
-{get [<var>expression</var>]() { ... } }</pre>
+```js
+{get prop() { ... } }
+{get [expression]() { ... } }
+```
 
-<h3 id="Parameters" name="Parameters">引数</h3>
+### 引数
 
-<dl>
- <dt><code><var>prop</var></code></dt>
- <dd>与えられた関数に結び付けられるプロパティの名前</dd>
- <dt><code><var>expression</var></code></dt>
- <dd>ECMAScript 6 より、算出されたプロパティ名 (computed property name) の式を使用して関数に結び付けることもできます。</dd>
-</dl>
+- `prop`
+  - : 与えられた関数に結び付けられるプロパティの名前
+- `expression`
+  - : ECMAScript 2015 より、算出されたプロパティ名 (computed property name) の式を使用して関数に結び付けることもできます。
 
-<h2 id="Description" name="Description">解説</h2>
+## 解説
 
-<p>時として、動的に計算した値を返すプロパティにアクセスを許可したほうが望ましい場合や、明示的なメソッドを呼び出すことなく内部変数に状態を反映させたい場合があります。 JavaScript では、<em>ゲッター</em>を使ってこれを行うことが可能です。</p>
+時として、動的に計算した値を返すプロパティにアクセスを許可したほうが望ましい場合や、明示的なメソッドを呼び出すことなく内部変数に状態を反映させたい場合があります。 JavaScript では、*ゲッター*を使ってこれを行うことが可能です。
 
-<p>プロパティに結び付けられたゲッターと、実際に値を持つプロパティを同時に持つことはできませんが、ゲッターとセッターを組み合わせて使用し、一種の擬似プロパティを作成することはできます。</p>
+プロパティに結び付けられたゲッターと、実際に値を持つプロパティを同時に持つことはできませんが、ゲッターとセッターを組み合わせて使用し、一種の擬似プロパティを作成することはできます。
 
-<p><code>get</code> 構文を使用する際の注意事項:</p>
+`get` 構文を使用する場合は、以下のことに注意してください。
 
-<ul>
- <li>数値または文字列による識別子を持つことができます。</li>
- <li>パラメータの数は 0 でなければなりません (詳しくは <a href="http://whereswalden.com/2010/08/22/incompatible-es5-change-literal-getter-and-setter-functions-must-now-have-exactly-zero-or-one-arguments/" rel="external nofollow">Incompatible <abbr title="ECMAScript 5th edition">ES5</abbr> change: literal getter and setter functions must now have exactly zero or one arguments</a> をご覧ください)。</li>
- <li>1つのオブジェクトリテラル中に、同じプロパティに対する別の <code>get</code> またはデータの割り当てが現れてはいけません (<code>{ get x() { }, get x() { } }</code> や <code>{ x: ..., get x() { } }</code> は禁止されています)。</li>
-</ul>
+- 数値または文字列による識別子を持つことができます。
+- 引数の数は 0 でなければなりません (詳しくは [Incompatible ES5
+  change: literal getter and setter functions must now have exactly zero or one
+  arguments](https://whereswalden.com/2010/08/22/incompatible-es5-change-literal-getter-and-setter-functions-must-now-have-exactly-zero-or-one-arguments/) をご覧ください)。
+- 1 つのオブジェクトリテラル中に、別の `get` が現れてはいけません。例えば次のようなことはできません。
+  ```js example-bad
+  { 
+    get x() { }, get x() { } 
+  }
+  ```
+- データ項目と同じ名前のプロパティが出現してはいけません。例えば次のようなことはできません。
+  ```js example-bad
+  { 
+    x: ..., get x() { } 
+  }
+  ```
 
-<h2 id="Examples" name="Examples">例</h2>
+## 例
 
-<h3 id="Defining_a_getter_on_new_objects_in_object_initializers" name="Defining_a_getter_on_new_objects_in_object_initializers">オブジェクト初期化時における新しいオブジェクトのゲッターの定義</h3>
+### オブジェクト初期化子における新しいオブジェクトのゲッターの定義
 
-<p>以下の例では、オブジェクト <code>obj</code> の擬似プロパティとして、 <code>log</code> 内の最後の配列アイテムを返す <code>latest</code> プロパティを作成します。</p>
+以下の例では `latest` 擬似プロパティをオブジェクト `obj` 作成し、 `log` 内の最後の配列アイテムを返します。
 
-<pre class="brush: js">const obj = {
+```js
+const obj = {
   log: ['example','test'],
   get latest() {
     if (this.log.length === 0) return undefined;
@@ -61,69 +71,87 @@ translation_of: Web/JavaScript/Reference/Functions/get
   }
 }
 console.log(obj.latest); // "test"
-</pre>
+```
 
-<p><code>latest</code> に値を代入しようとしても、変更はされないことに注意して下さい。</p>
+`latest` に値を代入しようとしても、変更はされないことに注意して下さい。
 
-<h3 id="Deleting_a_getter_using_the_delete_operator" name="Deleting_a_getter_using_the_delete_operator"><code>delete</code> 演算子によるゲッターの削除</h3>
+### `delete` 演算子によるゲッターの削除
 
-<p>ゲッターを削除したい場合は、 {{jsxref("Operators/delete", "delete")}} を使用します。</p>
+ゲッターを削除したい場合は、 {{jsxref("Operators/delete", "delete")}} を使用してください。
 
-<pre class="brush: js">delete <var>obj</var>.latest;
-</pre>
+```js
+delete obj.latest;
+```
 
-<h3 id="既存のオブジェクトへの_defineProperty_を使用したゲッターの定義">既存のオブジェクトへの <code>defineProperty</code> を使用したゲッターの定義</h3>
+### 既存のオブジェクトへの `defineProperty` を使用したゲッターの定義
 
-<p>任意のタイミングで既存のオブジェクトにゲッターを追加するには、 {{jsxref("Object.defineProperty()")}} を使用します。</p>
+既存のオブジェクトに任意のタイミングでゲッターを追加するには、 {{jsxref("Object.defineProperty()")}} を使用します。
 
-<pre class="brush: js">const o = {a: 0};
+```js
+const o = {a: 0};
 
 Object.defineProperty(o, 'b', { get: function() { return this.a + 1; } });
 
-console.log(o.b) // getter を実行。a + 1 を算出する (結果は 1)</pre>
+console.log(o.b) // getter を実行。a + 1 を算出する (結果は 1)
+```
 
-<h3 id="Using_a_computed_property_name" name="Using_a_computed_property_name">算出されたプロパティ名の使用</h3>
+### 算出されたプロパティ名の使用
 
-<pre class="brush: js">const expr = 'foo';
+```js
+const expr = 'foo';
 
 const obj = {
   get [expr]() { return 'bar'; }
 };
 
-console.log(obj.foo); // "bar"</pre>
+console.log(obj.foo); // "bar"
+```
+
+### 静的ゲッターの定義
+
+```js
+class MyConstants {
+  static get foo() {
+    return 'foo';
+  }
+}
+
+console.log(MyConstants.foo); // 'foo'
+MyConstants.foo = 'bar';
+console.log(MyConstants.foo); // 'foo' です。静的ゲッターの値は変更できません
+```
 
-<h3 id="Smart_self-overwriting_lazy_getters" name="Smart_self-overwriting_lazy_getters">スマート / 自己書き換え / 怠惰なゲッター</h3>
+### スマート / 自己書き換え / 遅延ゲッター
 
-<p>ゲッターはオブジェクトのプロパティを<em>定義</em>する手段を提供しますが、アクセスされるまでプロパティの値を<em>計算</em>しません。ゲッターは値を計算するコストを、値が必要になるまで先送りします。値が必要でなければ、そのコストを負担しません。</p>
+ゲッターはオブジェクトのプロパティを*定義*する手段を提供しますが、アクセスされるまでプロパティの値を*計算*しません。ゲッターは値を計算するコストを、値が必要になるまで先送りします。値が必要でなければ、そのコストを負担しません。
 
-<p>プロパティの値の計算を先送りしたり後のアクセスのためにキャッシュするための付加的な最適化技術が、<strong>スマート (または<a href="https://ja.wikipedia.org/wiki/%E3%83%A1%E3%83%A2%E5%8C%96">メモ化</a>) ゲッター</strong>です。初めてゲッターにアクセスされたときに、値を計算してキャッシュします。以降のアクセスでは再計算せずに、キャッシュした値を返します。これは次のような状況で役に立ちます。</p>
+プロパティの値の計算を先送りしたり後のアクセスのためにキャッシュするための付加的な最適化技術が、**スマート (または「[メモ化](https://ja.wikipedia.org/wiki/%E3%83%A1%E3%83%A2%E5%8C%96)」)ゲッター**です。初めてゲッターにアクセスされたときに、値を計算してキャッシュします。以降のアクセスでは再計算せずに、キャッシュした値を返します。これは次のような状況で役に立ちます。
 
-<ul>
- <li>プロパティの値の計算コストが高い場合 (大量の RAM や CPU 時間を使用する、ワーカースレッドを生成する、リモートのファイルを読み込むなど)。</li>
- <li>値がすぐに必要ではない場合。値を後で使用する、あるいはまったく使用しない場合がある状況。</li>
- <li>何度もアクセスされる値で、値が変更されないため再計算の必要がない、あるいは再計算すべきではない場合。</li>
-</ul>
+- プロパティの値の計算コストが高い場合 (大量の RAM や CPU 時間を使用する、ワーカースレッドを生成する、リモートのファイルを読み込むなど)。
+- 値がすぐに必要ではない場合。値を後で使用する、あるいはまったく使用しない場合がある状況。
+- 何度もアクセスされる値で、値が変更されないため再計算の必要がない、あるいは再計算すべきではない場合。
 
-<div class="note">
-<p>値が変わると見込まれるプロパティで、怠惰なゲッターを使用してはいけません。このようなゲッターは値を再計算しないためです。</p>
-</div>
+> **Note:** 値が変わると見込まれるプロパティで、遅延ゲッターを使用してはいけません。ゲッターが遅延である場合、値を再計算しないためです。
+>
+> なお、ゲッターの本質は「遅延」や「メモ化」ではありません。この動作を望む場合、この技術を実装する必要があります。
 
-<p>以下の例では、オブジェクトが自身のプロパティとしてゲッターを持っています。プロパティを取得すると、プロパティはオブジェクトから削除された後に再追加されますが、このとき暗黙的にデータプロパティとして追加されます。最終的に、値が返されます。</p>
+以下の例では、オブジェクトが自身のプロパティとしてゲッターを持っています。プロパティを取得すると、プロパティはオブジェクトから削除された後に再追加されますが、このとき暗黙的にデータプロパティとして追加されます。最終的に、値が返されます。
 
-<pre class="brush: js">get notifier() {
+```js
+get notifier() {
   delete this.notifier;
   return this.notifier = document.getElementById('bookmarked-notification-anchor');
-},</pre>
-
-<p>Firefox のコードでは、 <code>XPCOMUtils.jsm</code> コードモジュールもご覧ください。これは <code><a href="/ja/docs/Mozilla/JavaScript_code_modules/XPCOMUtils.jsm#defineLazyGetter()">defineLazyGetter()</a></code> 関数を定義しています。</p>
+},
+```
 
-<h3 id="get_vs._defineProperty" name="get_vs._defineProperty"><code>get</code> と <code>defineProperty</code></h3>
+### `get` と `defineProperty`
 
-<p><code>get</code> キーワードと {{jsxref("Object.defineProperty()")}} の使用は似た結果になりますが、 {{jsxref("classes")}} 上で使用する場合は微妙な違いがあります。</p>
+`get` キーワードと {{jsxref("Object.defineProperty()")}} の使用は似た結果になりますが、 {{jsxref("classes")}} 上で使用する場合は微妙な違いがあります。
 
-<p><code>get</code> を使用した場合は、プロパティはインスタンスのプロトタイプに定義されるのに対し、 {{jsxref("Object.defineProperty()")}} を使用した場合は、プロパティは適用されたインスタンスに定義されます。</p>
+`get` を使用した場合は、プロパティはインスタンスのプロトタイプに定義されるのに対し、 {{jsxref("Object.defineProperty()")}} を使用した場合は、プロパティは適用されたインスタンスに定義されます。
 
-<pre class="brush: js">class Example {
+```js
+class Example {
   get hello() {
     return 'world';
   }
@@ -141,34 +169,22 @@ console.log(
     Object.getPrototypeOf(obj), 'hello'
   )
 );
-// { configurable: true, enumerable: false, get: function get hello() { return 'world'; }, set: undefined }</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-method-definitions', 'Method definitions')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
-
-<p>{{Compat("javascript.functions.get")}}</p>
-
-<h2 id="See_also" name="See_also">関連情報</h2>
-
-<ul>
- <li><a href="/ja/docs/Web/JavaScript/Reference/Functions/set">setter</a></li>
- <li>{{jsxref("Operators/delete", "delete")}}</li>
- <li>{{jsxref("Object.defineProperty()")}}</li>
- <li>{{jsxref("Object.defineGetter", "__defineGetter__")}}</li>
- <li>{{jsxref("Object.defineSetter", "__defineSetter__")}}</li>
- <li><a href="/ja/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">ゲッターとセッターの定義</a> (JavaScript ガイド)</li>
-</ul>
+// { configurable: true, enumerable: false, get: function get hello() { return 'world'; }, set: undefined }
+```
+
+## 仕様書
+
+{{Specifications}}
+
+## ブラウザーの互換性
+
+{{Compat}}
+
+## 関連情報
+
+- [セッター](/ja/docs/Web/JavaScript/Reference/Functions/set)
+- {{jsxref("Operators/delete", "delete")}}
+- {{jsxref("Object.defineProperty()")}}
+- {{jsxref("Object/__defineGetter__", "__defineGetter__")}}
+- {{jsxref("Object/__defineSetter__", "__defineSetter__")}}
+- [ゲッターとセッターの定義](/ja/docs/Web/JavaScript/Guide/Working_with_Objects#defining_getters_and_setters) (JavaScript ガイド)