JavaScript では文字列、数値、配列、関数などすべてがオブジェクトです
さらに、JavaScript ではカスタム オブジェクトが可能です。
すべてはオブジェクトです
JavaScript には、String、Date、Array などのいくつかの組み込みオブジェクトが用意されています。 オブジェクトは、プロパティとメソッドを備えた特別なデータ型にすぎません。
JavaScript オブジェクト
オブジェクトは単なる特別な種類のデータです。オブジェクトにはプロパティとメソッドがあります。
オブジェクトのプロパティへのアクセス
属性はオブジェクトに関連付けられた値です。
オブジェクトのプロパティにアクセスするための構文は次のとおりです:
objectName.propertyName
この例では、String オブジェクトの長さプロパティを使用して文字列の長さを取得します:
var message="Hello World!"; var x=message.length;
上記のコードが実行されると、x の値は次のようになります:
12
オブジェクトにアクセスするメソッド
メソッドは、オブジェクトに対して実行できるアクションです。
次の構文を使用してメソッドを呼び出すことができます:
objectName.methodName()
この例では、String オブジェクトの toUpperCase() メソッドを使用してテキストを大文字に変換します。
var message="Hello world!"; var x=message.toUpperCase();
上記のコードが実行されると、x の値は次のようになります:
HELLO WORLD!
JavaScript オブジェクトの作成
JavaScript を使用すると、独自のオブジェクトを定義して作成できます。
新しいオブジェクトを作成するには 2 つの異なる方法があります:
ダイレクトインスタンスを作成する
この例では、オブジェクトの新しいインスタンスを作成し、それに 4 つのプロパティを追加します:
例
person=new Object(); person.firstname="John"; person.lastname="Doe"; person.age=50; person.eyecolor="blue";
代替構文 (オブジェクト リテラルを使用):
例
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};
オブジェクト コンストラクターを使用する
この例では、関数を使用してオブジェクトを構築します:
例
function person(firstname,lastname,age,eyecolor) { this.firstname=firstname; this.lastname=lastname; this.age=age; this.eyecolor=eyecolor; }
JavaScript オブジェクト インスタンスを作成します
オブジェクト コンストラクターを取得したら、次のように新しいオブジェクト インスタンスを作成できます:
var myFather=new person("John","Doe",50,"blue"); var myMother=new person("Sally","Rally",48,"green");
JavaScript オブジェクトにプロパティを追加する
オブジェクトに値を割り当てることで、既存のオブジェクトに新しいプロパティを追加できます:
personObj がすでに存在すると仮定すると、次の新しいプロパティをそれに追加できます: 名、姓、年齢、目の色:
person.firstname="John"; person.lastname="Doe"; person.age=30; person.eyecolor="blue"; x=person.firstname;
上記のコードが実行されると、x の値は次のようになります:
John
メソッドは、オブジェクトに付加された関数にすぎません。
コンストラクター関数内でオブジェクト メソッドを定義します:
function person(firstname,lastname,age,eyecolor) { this.firstname=firstname; this.lastname=lastname; this.age=age; this.eyecolor=eyecolor; this.changeName=changeName; function changeName(name) { this.lastname=name; } }
今すぐ試してみましょう:
myMother.changeName("Doe");