JavaScriptのオブジェクト
- 前のページ JS ファンクション
- 次のページ JS イベント
実際の生活のオブジェクト、属性、およびメソッド
実際の生活では、車はオブジェクト。
車は重さや色などの属性、起動や停止などの方法:
オブジェクト | 属性 | 方法 |
---|---|---|
car.name = porsche car.model = 911 car.length = 4499mm car.color = white |
car.start() car.drive() car.brake() car.stop() |
すべての車は同じ属性を持ちますが、属性値は車によって異なります。
すべての車は同じ方法しかし、メソッドは異なる時間に実行されます。
JavaScriptのオブジェクト
あなたが学んだように、JavaScript 変数はデータ値のコンテナです。
このコードは単一の値(porsche)を名前 car に変数:
var car = "porsche";
オブジェクトも変数ですが、オブジェクトは多くの値を含んでいます。
このコードは複数の値(porsche, 911, white)を名前 car に変数:
var car = {type:"porsche", model:"911", color:"white"};
値は名前:値名前と値がコロンで区切られた
JavaScript オブジェクトは名前付き値のコンテナと呼ばれます。
オブジェクト属性
(JavaScript オブジェクトの)名前:値対は属性。
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
属性 | 属性値 |
---|---|
firstName | Bill |
lastName | Gates |
age | 62 |
eyeColor | blue |
オブジェクトメソッド
オブジェクトも方法。
方法はオブジェクト上で実行されるアクション。
方法は関数定義属性に保存されています。
属性 | 属性値 |
---|---|
firstName | Bill |
lastName | Gates |
age | 62 |
eyeColor | blue |
fullName | function() {return this.firstName + " " + this.lastName;} |
関数は属性として保存される。
インスタンス
var person = { firstName: "Bill", lastName : "Gates", id : 678, fullName : function() { return this.firstName + " " + this.lastName; } };
this キーワード
関数定義では、this
関数の所有者を参照しています。
の例では、this
は "fullName" 関数を持つ person オブジェクト。
言い換えれば、this.firstName
の意味は this オブジェクトの firstName 属性
以下の JS this キーワードこの章では this キーワードに関する知識を学びます。
オブジェクト定義
以下のように JavaScript オブジェクトを定義(作成)しました:
インスタンス
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
スペースや改行は許可されています。オブジェクト定義は複数行にわたって書くことができます:
インスタンス
var person = { firstName:"Bill", lastName:"Gates", age:50, eyeColor:"blue" };
オブジェクト属性にアクセス
属性にアクセスするには以下の2つの方法があります:
objectName.propertyName
または
objectName["propertyName"]
例 1
person.lastName;
例 2
person["lastName"];
オブジェクトメソッドにアクセス
オブジェクトメソッドにアクセスするには以下の文法を使用できます:
objectName.methodName())
インスタンス
name = person.fullName();
もし、() を使用しない fullName メソッドにアクセスすると、以下が返されます関数定義:
インスタンス
name = person.fullName;
メソッドは実際には属性値の形式で保存された関数定義です。
文字列、数値、布尔値をオブジェクトとして宣言しないでください!
JavaScript 変数を "new" キーワードで宣言する場合、その変数はオブジェクトとして作成されます:
var x = new String(); // x を String オブジェクトとして宣言 var y = new Number(); // y を Number オブジェクトとして宣言 var z = new Boolean(); // z を Boolean オブジェクトとして宣言
文字列、数値、論理オブジェクトを避けてください。これらはコードの複雑さを増やし、実行速度を低下させます。
このチュートリアルの後の章で、オブジェクトに関するさらに多くの知識を学びます。
教科書
さらに詳しい情報については JavaScriptのオブジェクトの知識については、JavaScript 高級チュートリアルの関連内容を参照してください:
- ECMAScript オブジェクト指向技術
- このセクションでは、オブジェクト指向技術の用語、オブジェクト指向言語の要件、オブジェクトの構成について簡単に紹介します。
- ECMAScript オブジェクトの適用
- このセクションでは、オブジェクトの宣言とインスタンス化、参照と廃棄、バインディングの概念について説明します。
- ECMAScript オブジェクトのタイプ
- このセクションでは、ECMAScript の3つのタイプ(ローカルオブジェクト、インボートオブジェクト、ホストオブジェクト)について説明し、関連するリファレンスマニュアルへのリンクを提供します。
- ECMAScript オブジェクトのスコープ
- このセクションでは、ECMAScript のスコープおよび this キーワードについて説明します。
- ECMAScript でのクラスやオブジェクトの定義
- このセクションでは、ECMAScript オブジェクトやクラスの作成方法について詳細に説明します。
- ECMAScript でのオブジェクトの変更
- このセクションでは、新しいメソッドの作成や既存のメソッドの再定義を通じてオブジェクトを変更する方法について説明します。
- 前のページ JS ファンクション
- 次のページ JS イベント