diff options
Diffstat (limited to 'files/ja/web/javascript/reference/statements/const/index.html')
| -rw-r--r-- | files/ja/web/javascript/reference/statements/const/index.html | 157 |
1 files changed, 157 insertions, 0 deletions
diff --git a/files/ja/web/javascript/reference/statements/const/index.html b/files/ja/web/javascript/reference/statements/const/index.html new file mode 100644 index 0000000000..43adf695ee --- /dev/null +++ b/files/ja/web/javascript/reference/statements/const/index.html @@ -0,0 +1,157 @@ +--- +title: const +slug: Web/JavaScript/Reference/Statements/const +tags: + - ECMAScript 2015 + - JavaScript + - Language feature + - Reference + - Statement + - constants +translation_of: Web/JavaScript/Reference/Statements/const +--- +<div>{{jsSidebar("Statements")}}</div> + +<p>定数 (const) は、<code><a href="/ja/docs/Web/JavaScript/Reference/Statements/let">let</a></code> キーワードを使って定義する変数と同じ、ブロックスコープを持ちます。定数の値は、再代入による変更はできず、再宣言もできません。</p> + +<div>{{EmbedInteractiveExample("pages/js/statement-const.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">const <var>name1</var> = <var>value1</var> [, <var>name2</var> = <var>value2</var> [, ... [, <var>nameN</var> = <var>valueN</var>]]];</pre> + +<dl> + <dt><code><var>nameN</var></code></dt> + <dd>定数名。正当な{{Glossary("identifier", "識別子")}}ならは、どんなものでもかまいません。</dd> + <dt><code><var>valueN</var></code></dt> + <dd>定数の値。正当な<a href="/docs/Web/JavaScript/Guide/Expressions_and_Operators#Expressions">式</a>ならば、どんなものでもかまいません。</dd> +</dl> + +<p><a href="/ja/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">分割代入</a>構文は、変数の宣言にも使用できます。</p> + +<pre class="syntaxbox notranslate">const <var>{ bar }</var> = <em>foo</em>; // where foo = { bar:10, baz:12 }; +/* これは、値が 10 の 'bar' という名前の変数を作成します。*/</pre> + +<dl> +</dl> + +<h2 id="Description" name="Description">解説</h2> + +<p>この宣言は、宣言された場所に応じて、グローバルまたはブロック内にローカルなスコープを持った定数を作成します。グローバルな定数は {{jsxref("Statements/var", "var")}} 変数とは異なり、{{domxref("window")}} オブジェクトのプロパティには<strong>なりません</strong>。</p> + +<p>定数には初期化子が必要です。その値は、宣言されたのと同じ文の中で指定しなければなりません。(後から変更できないことを考えると、これは理にかなっています)</p> + +<p><strong><code>const</code> 宣言</strong>は、値への読み取り専用の参照を作ります。これは、定数に保持されている値は<strong>不変ではなく</strong>、その変数の識別子が再代入できないということです。たとえば、定数の中身がオブジェクトの場合、オブジェクトの内容（プロパティなど）は変更可能です。</p> + +<p>「<a href="/ja/docs/Web/JavaScript/Reference/Statements/let#Temporal_dead_zone">一時的なデッドゾーン</a>」に関する考慮事項はすべて、{{jsxref("Statements/let", "let")}} と <code>const</code> の両方に適用されます。</p> + +<p>定数は、同じスコープ内の関数や変数と同じ名前にすることはできません。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Basic_const_usage" name="Basic_const_usage">基本的な定数の使い方</h3> + +<p>定数は大文字または小文字で宣言することができますが、すべて大文字で宣言するのが慣例です。</p> + +<pre class="brush: js; notranslate">// MY_FAV を定数として定義して、その値を 7 にします。 +const MY_FAV = 7; + +// これはエラーを投げます。 +// Uncaught TypeError: Assignment to constant variable. +MY_FAV = 20; + +// MY_FAV は 7 です。 +console.log('my favorite number is: ' + MY_FAV); + +// 定数を再宣言しようとするとエラーを投げます。 +// Uncaught SyntaxError: Identifier 'MY_FAV' has already been declared +const MY_FAV = 20; + +// MY_FAV という名前は上記の定数のために予約されているので、これも失敗します。 +var MY_FAV = 20; + +// これもエラーを投げます。 +let MY_FAV = 20; + +</pre> + +<h3 id="Block_scoping" name="Block_scoping">ブロックスコープ</h3> + +<p>ブロックスコープの性質に注意することが重要です。</p> + +<pre class="brush: js notranslate">if (MY_FAV === 7) { + // これは問題なく、ブロックスコープの MY_FAV 変数を作成します。 + // （ブロックスコープの変数を宣言する let も問題なく機能します） + let MY_FAV = 20; + + // MY_FAV は現在 20 です。 + console.log('my favorite number is ' + MY_FAV); + + // これはグローバルコンテキストに巻き上げられ、エラーを投げます。 + var MY_FAV = 20; +} + +// MY_FAV は 7 のままです。 +console.log('my favorite number is ' + MY_FAV); +</pre> + +<h3 id="const_needs_to_be_initialized" name="const_needs_to_be_initialized">定数は初期化が必要です。</h3> + +<pre class="brush: js notranslate">// エラーが投げられます。 +// Uncaught SyntaxError: Missing initializer in const declaration + +const FOO; +</pre> + +<h3 id="const_in_objects_and_arrays" name="const_in_objects_and_arrays">オブジェクトと配列の定数</h3> + +<p>定数はオブジェクトや配列に対しても動作します。</p> + +<pre class="brush: js notranslate">const MY_OBJECT = {'key': 'value'}; + +// オブジェクトの上書きはエラーを投げます。 +// Uncaught TypeError: Assignment to constant variable. +MY_OBJECT = {'OTHER_KEY': 'value'}; + +// しかしながら、オブジェクトのキーは保護されていないので、 +// 次の文は問題なく実行されます。 +MY_OBJECT.key = 'otherValue'; // Object.freeze() を使用すればオブジェクトを不変にできます。 + +// 配列も同じです。 +const MY_ARRAY = []; +// 配列にアイテムをプッシュすることができます。 +MY_ARRAY.push('A'); // ["A"] +// しかしながら、新しい配列を変数に代入するとエラーを投げます。 +// Uncaught TypeError: Assignment to constant variable. +MY_ARRAY = ['B'];</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-let-and-const-declarations', 'Let and Const Declarations')}}</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.statements.const")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("Statements/var", "var")}}</li> + <li>{{jsxref("Statements/let", "let")}}</li> + <li><a href="/ja/docs/Web/JavaScript/Guide/Grammar_and_types#Constants">JavaScript ガイド - 『値、変数、リテラル』 - 定数</a></li> +</ul> |