【JavaScript】 プリミティブとは？リテラルやオブジェクトとの違い

JavaScriptにはリテラルやプリミティブ・オブジェクトなど、データをあらわす言葉が複数あります。

今回は、これらの違いについて整理をしていきます。

例えば次のようなコードがあるとします。

const a = 1;

ネット等で調べていると、コード上の 1 についてリテラルと表現していたり、プリミティブと表現していたりします。

どちらも正しいのですが、 リテラルとプリミティブは別のものです。

リテラルとは、プログラムコード上でデータを表現する文字列の集まりです。

プリミティブとはJavaScriptエンジンの内部で割り当てられたデータのうち、数値そのもののやテキストそのものといった、最小単位のデータを指します。

オブジェクトは、プリミティブやオブジェクトを指し示すプロパティを持つデータ構造です。

これではわかりにくいと思うので、リテラルとプリミティブとオブジェクトについて、もう少し詳しく解説してみます。

リテラルとはJavaScript文法の中の一つで、データを定義することができます。

例えば、数字は数値をあらわすリテラルです。
ダブルクォーテーション(")やシングルクォーテーション(')で囲むと、文字列をあらわすリテラルです。

データはプリミティブとオブジェクトの二つに分類でき、リテラルは両方を定義することができます。

リテラル一覧

プリミティブは最下位レベルで扱われる直接的な実データです。

プリミティブが生成されるパターン

関連するリテラルをプログラムコードから読み取りプリミティブに変換されるケースと、演算結果により生成されるケースがあります。

const a = 1;  // 値が1の数値型プリミティブが作成される 
const b = "abcde"; // 値が"abcde"の文字列型が作成される 

上の例ではコードから数値リテラルの「1」が読み取られ、値が1の数値型プリミティブが作成されます。
作成されたプリミティブにはラベルのようなものが割り当てられ、そのラベルが変数aに代入されます。

■関連記事：【JavaScript】 参照渡し？値渡し？これで悩む必要がなくなる！かも

const a = 1;
const b = 2;
const c = a + b; 
 // プリミティブ値1 と プリミティブ値2 から プリミティブ値3が作成される

上の例では、aとbが持っているラベルを見て、値1と2を取り出し加算します。
加算した結果から、あらたに値が3の数値型プリミティブが作成され、割り当てられたラベルのようなものが変数cに割り当てられます。

プリミティブは上書きされない

JavaScriptの仕様では、一度作成されたプリミティブが上書きされることがありません。

例えば次の例は、変数aが指し示すプリミティブ値1が、3に変更されることはありません。

const a = a + b; 

あらたに値が3の数値型プリミティブが作成されて、変数aにそのプリミティブのラベルのようなものが割り当てられています。

プリミティブ値1は残っているのです。

プリミティブを削除する方法はない

JavaScriptの仕様では、コードからこのプリミティブ値1を削除する方法が定義されていません。
ですが、プリミティブ値が持つラベルのようなものが変数に代入されていないかをチェックし、使用されていなければ自動的に削除してくれる機能が実装されています。

プリミティブundefinedとリテラル

次のコードは、変数にnullプリミティブとundefinedプリミティブを代入しています。

const a = null;
const b = undefined;

nullは、リテラルです。
しかしundefinedはリテラルではありません。

undefinedはグローバルオブジェクトのundefinedプロパティを参照しています。
このプロパティにはundefinedプリミティブがセットされているので、結果的に変数bにundefinedプリミティブがセットされます。

プリミティブ一覧

オブジェクトとは、プリミティブやオブジェクトを指し示すプロパティを持つデータ構造です。

const a = {
     num : 1,   // プリミティブ

     obj: {  // オブジェクト

         text : "今日は晴れです",  // プリミティブ

         objA : { // オブジェクト
             ・・・・
         }
     }
}

オブジェクト内にオブジェクトを定義することが可能なためどこまでのネストしていくことが可能ですが、最終的にはプロパティで終了するか、親オブジェクトの参照による循環参照のどちらかになります。

const a = { obj: { } , text:"A" };
a.obj.a = a;

console.log( a.obj.a.obj.a.obj.a.text ); // "A"

JavaScriptは内部的には、関数や配列もオブジェクトで定義されています。
そのためプロパティ追加や既存プロパティの変更することで、自分用にカスタマイズすることが可能です。

しかし本来の機能を損なう可能性があることから、業界での作法としてプロパティの追加や変更は非推奨となっています。