吉本集の個人ブログ
Web制作の技術について書いています。たまに日記も書きます。

【JS入門】データには型がある(オブジェクト型について)

2018年1月13日 / category : javascript

前回の記事では、データには型があり、型の種類は大きく分けてプリミティブ型とオブジェクト型の2種類あり、プリミティブ型について解説しました。
今回の記事では、残りのオブジェクト型について解説していきたいと思います。

オブジェクト型について

データの型は2種類ですので、プリミティブ型以外のデータはオブジェクト型になるということになります。
プリミティブ型は「プロパティやメソッドを保持しないデータ」という解説しました。
オブジェクト型は「プロパティやメソッドを保持するデータ」ということになります。
ということで、まずはプロパティとメソッドとはどういうものかを解説していきたいところですが、その前にオブジェクト型の「オブジェクト」というのはどういうものかを先に解説します。

オブジェクトとは

'お腹減った', 100, true, undefined, null

上のような値(データ)は、プリミティブ型のデータです。
それに対して、オブジェクト型のデータは、次のような形式です。

{}

この記号だけでは、よくわからないと思いますが、まずこの記号がオブジェクト型なのか確認してみます。

sample.js
console.log( typeof {} );

コンソール画面を見るとobjectと出ます。確かにオブジェクト型のデータですが、これは空のオブジェクトの状態です。(オブジェクトの中に何も情報が入っていない状態)
これからこのオブジェクトに情報を入れていきますが、この中に入る情報は大きく分けて2種類あり、それがプロパティとメソッドになります。

プロパティとは

まず、下のコードを見てみましょう。

sample.js
var obj = {
	name: '吉本'
}
console.log( obj.name );

{}をobj変数に代入し、{}の中に、

name: '吉本'

というコードを代入しました。これがプロパティになります。プロパティは次のような形式になります。

プロパティ名: 値(データ) // 例) name: '吉本', age: 37, flag: true

参照する場合は、

オブジェクト名(変数名).プロパティ名 // 例) obj.name, obj.age, obj.flag

または

オブジェクト名(変数名)['プロパティ名'] // 例) obj['name'], obj['age'], obj['flag']

という形式になります。上のコードの場合は、次のようになります。

sample.js
var obj = {
	name: '吉本'
}
console.log( obj['name'] );

オブジェクト情報の中は、必ず次のような形式になっています。

var obj = {
	AAA: aaa,
	BBB: bbb,
	CCC: ccc
}

英字の大文字の部分(左側)を「key(キー)」と呼びます。
英字の小文字の部分(右側)が値(データ)になりますが、この値(データ)がプリミティブ型のデータである場合、この組み合わせを「プロパティ」と呼び、その時の「key(キー)」を「プロパティ名」と呼びます。

var obj = {
	プロパティ名: プリミティブ型のデータ ← プロパティ
}

値がプリミティブ型のデータの場合は、プロパティでしたが、プリミティブ型のデータが入った変数を値に指定することも可能です。

sample.js
var yoshimoto = '吉本';
var obj = {
	name: yoshimoto
}
console.log( obj['name'] );

「吉本」というテキストデータが代入されたyoshimoto変数をオブジェクトのname属性の値に指定しています。

ここまでがプロパティの解説です。
それではもうひとつのメソッドには、どのような値が入るでしょうか。

メソッドとは

値(データ)に関数が入ったものをメソッドと呼びます。

sample.js
var obj = {
	getHello: function(){
		return 'こんにちわ';
	}
}

getHello属性に、関数が代入されている例です。これをメソッドと呼びますが、ここで関数を理解しなければいけません。
次回の記事で、関数について解説していきたいと思います。

以上が、オブジェクト型についての解説でした。
ここまでを少しまとめると、JavaScript言語で使用するデータは、プリミティブ型とオブジェクト型のどちらかになり、プリミティブ型とは、プロパティやメソッドを保持しない不変な値(データ)、オブジェクト型はプロパティとメソッドを保持するデータである。プロパティとは、プリミティブ型の値を保持した属性で、メソッドとは、関数を保持した属性である。