コンテンツへスキップ
JavaScriptで定数を作成する方法は?

JavaScriptで定数を作成する方法は?

定数は、値を変更できない不変変数です。定数を一度作成すると、その値は変更できません。JavaScript でコーディングしているときに、定数を作成する要件に出くわしたことがあるかもしれません。ECMA Script 6 より前は、JavaScript で定数を作成するのはあまり簡単ではありませんでした。この投稿では、お見せします[...]

3min read

定数は、値を変更できない不変変数です。定数を一度作成すると、その値は変更できません。

constants in JavaScript

JavaScript でコーディングしているときに、定数を作成する要件に出くわしたことがあるかもしれません。ECMA Script 6 より前は、JavaScript で定数を作成するのはあまり簡単ではありませんでした。この投稿では、ECMAスクリプト5とECMAスクリプト6の両方で定数を作成する方法を示します。

Constants in ECMA 5

ECMA Script 5 では、Object.defineProperty() を使用して定数を作成できます。 まず、変数がグローバル変数になるのか、ウィンドウオブジェクトの一部になるのかを確認する必要があります。 それが決定したら、 writable を false に設定して変数を作成します。

Object.defineProperty(typeof global==="object" ? global : window,
    "foo",
    {
    value: 10000,
    enumerable: true,
    configurable: true,
    writable: false
});

Object.defineProperty() 関数は 3 つのパラメータを取ります。

  1. 変数を作成するオブジェクト
  2. 作成する変数の名前
  3. 変数の動作を構成するオブジェクト。

定数を作成するには、

  1. 最初のパラメータとして、window オブジェクトまたはグローバル オブジェクトを渡します
  2. 2 番目のパラメーターとして、作成する変数の名前 (この場合は foo) を渡します。
  3. 3 番目のパラメーターとして、変数の動作を構成するための object を渡しています。書き込み可能なプロパティを false にすることに留意してください。

定数fooを作成しました。foo の値を再割り当てしようとすると、JavaScript はそれを無視します。ただし、JavaScript を strict モードで実行すると、JavaScript は例外をスローします。 これを実際に見てみましょう、私たちはJavaScriptをstrictモードで実行し、fooの値を再割り当てしようとしています。

"use strict"

Object.defineProperty(typeof global==="object" ? global : window,
    "foo",
    {
    value: 10000,
    enumerable: true,
    configurable: true,
    writable: false
});

console.log(foo);
foo=90;
console.log(foo);

厳密モードのため、JavaScript は次の画像に示すように例外をスローします。

厳密モードのため、JavaScriptは画像に示すように例外をスローします

このように、Object.defineProperty() を使用し、 writable を false にすることで、ECMA Script 5 で定数を作成することができます。

Constants in ECMA 6

お気づきかもしれませんが、ECMA Script 5 で定数を作成するのはそれほど簡単ではありませんでした。ECMA Script 6 では、新機能 const が導入されました。これにより、定数または不変変数を作成できます。

const foo=10000;
console.log(foo);

foo の値を再割り当てしようとすると、JavaScript は ECMA Script 6 でそれについて文句を言います。 以下のリストに示すように、foo の値を再割り当てしてみましょう。

const foo=10000;
console.log(foo);
foo=90;
console.log(foo);

JavaScriptは、次の画像に示すように、これについて文句を言います。

画像に示すように、JavaScriptはこれについて文句を言います

これらは、JavaScript で定数を作成する 2 つの方法です。この記事がお役に立てば幸いです。読んでくれてありがとう。

デモを予約