オブジェクト

JavaScript でのオブジェクト指向プログラミングについて少し詳しく知りたい方は、 プログラミング徹底解説 - JavaScript によるオブジェクト指向プログラミング をじっくり読んでいただくことにしまして・・・

当サイトは "JavaScript 入門" ということですから、ざっと概要を把握できることを目指しましょう。

ここでは "オブジェクト" の作り方と使い方を具体例で紹介します。

Object のコンストラクタで作成

new によって Object オブジェクトを作ることで、動的にプロパティを設定可能なオブジェクトを作ることができます。

var x;

x = new Object();
x.p1 = 'Hello';

document.write( x.p1 + '<br>' );

Object オブジェクトというと何やら紛らわしいですが、使い方は単純ですね。

new で生成でき、ドットで名前を指定することによって、必要に応じて名前と値のペアを動的に追加し、保持することができます。

オブジェクトリテラルによる表記

new Object と同様なのが、次の例です。

x = {};
x.p1 = 'Hello';

document.write( x.p1 + '<br>' );
document.write( x["p1"] + '<br>');

{} でオブジェクトを生成できます。

また上のコード内に示したように、ドット (.) で指定した名前は ["名前"] としてもアクセス可能です。逆に、[] で指定した名前と値に、ドット表記でアクセスもできます。

先の例では {} でオブジェクトを作って、後から名前と値を追加、という段取りにしましたが、オブジェクト生成時に同時に指定することも可能です。

その場合は、次のようにします。

{
	名前1: 値1,
	名前2: 値2,
	...
}

改行は任意です。要は "名前:値" というペアをカンマ区切りで指定できるということです。具体的には上と同様のオブジェクトは次のように書けます。

x = {
	p1: 'Hello'
};

値として関数オブジェクトも指定できる

ここまでの例では値として、文字列 (string) の 'Hello' だけを指定していました。

しかし値としては数字や他のオブジェクトを保持することも可能です。例えば、関数オブジェクトを保持すれば次のように関数を呼び出すことも可能です。

x = {
	p1: 'Hello',
	f1: function(s){
		document.write(s + '<br>');
	}
};

x.f1( x.p1 );

ここまでお読みいただき、誠にありがとうございます。SNS 等でこの記事をシェアしていただけますと、大変励みになります。どうぞよろしくお願いします。

© 2024 JavaScript 入門