JavaScriptオブジェクト
実際のオブジェクト、プロパティ、およびメソッド
実生活では、車はオブジェクトです。
車には、重量や色などのプロパティと、開始や停止などの方法があります。
物体 | プロパティ | メソッド |
---|---|---|
car.name =フィアット car.model = 500 car.weight = 850kg car.color =白 |
car.start() car.drive() car.brake() car.stop() |
すべての車は同じプロパティを持っていますが、プロパティ値は車ごとに異なります。
すべての車の方法は同じですが、方法は 異なる時間に実行されます。
JavaScriptオブジェクト
JavaScript変数はデータ値のコンテナーであることはすでに学習しました。
このコードは、 carという名前の変数に単純な値(Fiat)を割り当てます。
let car = "Fiat";
オブジェクトも変数です。ただし、オブジェクトには多くの値を含めることができます。
このコードは、 carという名前の変数に多くの値(フィアット、500、白)を 割り当てます。
const car = {type:"Fiat", model:"500", color:"white"};
値は、name:valueのペア(コロンで区切られた名前と値)として書き込まれます。
constキーワードを使用してオブジェクトを宣言するのが一般的な方法です。
オブジェクトでのconstの使用の詳細については、「 JSConst」の章を参照してください。
オブジェクト定義
オブジェクトリテラルを使用してJavaScriptオブジェクトを定義(および作成)します。
例
const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
スペースと改行は重要ではありません。オブジェクト定義は複数行にまたがることができます。
例
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
オブジェクトのプロパティ
JavaScriptオブジェクトのname:valuesペアはプロパティと呼ばれます:
財産 | プロパティ値 |
---|---|
ファーストネーム | ジョン |
苗字 | Doe |
年 | 50 |
目の色 | 青い |
オブジェクトプロパティへのアクセス
オブジェクトのプロパティには、次の2つの方法でアクセスできます。
objectName.propertyName
また
objectName["propertyName"]
例1
person.lastName;
例2
person["lastName"];
JavaScriptオブジェクトは、プロパティと呼ばれる名前付きの値のコンテナです。
オブジェクトメソッド
オブジェクトはメソッドを持つこともできます。
メソッドは、オブジェクトに対して実行できるアクションです。
メソッドは、関数定義としてプロパティに格納されます。
財産 | プロパティ値 |
---|---|
ファーストネーム | ジョン |
苗字 | Doe |
年 | 50 |
目の色 | 青い |
フルネーム | function(){return this.firstName + "" + this.lastName;} |
メソッドは、プロパティとして保存される関数です。
例
const person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function() {
return this.firstName + " " + this.lastName;
}
};
このキーワード_
関数定義では、関数this
の「所有者」を指します。
上記の例でthis
は、は関数を「所有する」
personオブジェクトfullName
です。
つまり、はこのオブジェクトのプロパティをthis.firstName
意味します。firstName
JS thisKeywordthis
でキーワードの詳細をお読みください。
オブジェクトメソッドへのアクセス
次の構文でオブジェクトメソッドにアクセスします。
objectName.methodName()
例
name = person.fullName();
()括弧なしでメソッドにアクセスすると、関数定義が返されます。
例
name = person.fullName;
文字列、数値、ブール値をオブジェクトとして宣言しないでください。
JavaScript変数がキーワード " new
"で宣言されると、変数はオブジェクトとして作成されます。
x = new String(); // Declares x as a String object
y = new Number(); // Declares y as a Number object
z = new Boolean(); // Declares z as a Boolean object
String
、、Number
およびBoolean
オブジェクトは避けてください。コードが複雑になり、実行速度が低下します。
オブジェクトについては、このチュートリアルの後半で詳しく学習します。