JavaScript - プリミティブ型とオブジェクト

オブジェクト

オブジェクト (object) は複数の値や複雑な値を表すことができます。オブジェクトを作成するためには、以下の3通りの方法があります。

  • new Object() で作成する
  • {...} のリテラル表現で作成する
  • Object.create() で作成する

new Object() でオブジェクト作成する例は以下のとおりです。

// 空のオブジェクトを作成する
var o = new Object();
var o = new Object(undefined);
var o = new Object(null);

// オブジェクトを格納する
var o = new Object(true);      // new Boolean(true);  に同じ
var o = new Object(Boolean()); // new Boolean(false); に同じ
var o = new Object(12.3);      // new Number(12.3);   に同じ
var o = new Object("ABC");     // new String("ABC");  に同じ

// プロパティを定義する
var myCar = new Object();
myCar.make  = 'Ford';
myCar.model = 'Mustang';
myCar.year  = 1969;
new Object() で作成する

{...} のリテラル表現でオブジェクト作成する例は以下のとおりです。

// 空のオブジェクトを作成する
var o = {};

// プロパティを定義する
var myCar = {};
myCar.make  = 'Ford';
myCar.model = 'Mustang';
myCar.year  = 1969;
{...} のリテラル表現で作成する

Object.create() でオブジェクトを作成するする例は以下のとおりです。親のプロトタイプを継承して、子のオブジェクトに設定することができます。

// 親オブジェクトを作成する
function parentObj() {};
parentObj.prototype.foo = "bar";

// 子オブジェクトを作成する
function childObj() {}
childObj.prototype = Object.create(parentObj.prototype);

console.log(childObj.prototype.foo); // bar
Object.create() で作成する

オブジェクトに記憶されるもののことをプロパティと呼びます。プロパティは「名前」と「値」からなります。

obj.color = "blue";
プロパティの定義

プロパティにアクセスするには . を使います。また ["..."] の形でプロパティ名を指定することもできます。

const obj = {};
obj.color = "blue";

console.log(obj.color);    // blue
console.log(obj["color"]); // blue
console.log(obj[color]);   // ReferenceError
プロパティの定義

プロパティを削除するためには delete 演算子を使います。

const obj = {color:"blue"};
console.log(obj.color);    // blue

delete obj.color;
console.log(obj.color);    // undefined
プロパティの削除

プロパティが存在するか確認するためには in 演算子を使います。

const obj = {color:"blue"};
"color" in obj; // true
プロパティのテスト

プリミティブ型とオブジェクト

JavaScript では、プリミティブ型とオブジェクトでは、基本的に異なります。

プリミティブ型はプリミティブ型値を変更する方法がないため不変です。文字列を変更するように見えるメソッドは、すべて文字列を変更するのではなく新たな文字列を返しています。

var s = "hello";
s.toUpperCase(); // HELLO
console.log(s);  // hello
不変なプリミティブ型

不変なプリミティブ型に対してオブジェクトは可変であり、値を変更できます。

var o = { x:1 }; // オブジェクトは可変
o.x   = 2;       // プロパティの値を変更
o.y   = 3;       // 新しいプロパティを追加
可変なオブジェクト

値の比較においてもプリミティブ型とオブジェクトでは判定方法が異なります。

プリミティブ型は値で比較します。2 つのプリミティブ型値が同じ値を持つ場合にのみ、2 つの値は等しいと判定されます。

オブジェクトの比較は値では行いません。同じプロパティ名と値を持っていても 2 つのオブジェクトは等しいとは判定されません。

var o = {x:1}, p = {x:1};
o === p // false
オブジェクトの比較

2 つのオブジェクト値は、両方が同じオブジェクトを参照している場合のみ同一と判定されます。

var a = [];
var b = a;  // b は a の配列を参照する。
a === b     // true
オブジェクトの比較

上記の例では、オブジェクトのコピーを作成しているわけではありません。変数にオブジェクトを代入すると、オブジェクトを参照することになります。

var a = [];
var b = a;

b[0] = 1;
console.log(a[0]); // 1
オブジェクトの参照

オブジェクトや配列のコピーを作成したい場合は Object.assign を使います。

var obj = { a: 1 };
var copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }
オブジェクトのコピー

関連記事