プレゼンテーションシナリオ: スライド56、57
スライド56と57では、JavaScript Objectsについて説明します。
JavaScriptのObjectは、key–valueのペアの形式で複数の値を同時に格納できる特別なデータ型で、波括弧{ }内に記述されます。各key–valueペアはプロパティ(property)と呼ばれます。
例:
const car = { type: "Fiat", model: "500", color: "white" };
Key(キー):プロパティ名(property name)です。Keyは常にstringまたはsymbolです。
上の図の例では、keyは:type、model、colorです
Value(値):keyに割り当てられた内容です。Valueはあらゆるデータ型(number、string、array、function、別のobjectなど)にできます。
上記の例のvalueは:"Fiat"、"500"、"white"です
オブジェクトの作成方法
次の3つの方法があります:
① Object Literal({ }を使用) – これが最も一般的な方法です
例:
const car = { type: "Fiat", model: "500", color: "white" };
- 波括弧{ }を使用してオブジェクトを直接記述します。
- 内部にはkey–valueのペアがあります(例:type: "Fiat")。
- これは簡潔で読みやすく理解しやすい方法です → ほぼすべてのJSコードでこの方法が使用されます。
JSでオブジェクトについて考えるとき、デフォルトでliteral {}を使用します。
② コンストラクタ(constructor)Objectを呼び出してオブジェクトを作成:new Object()
例:
let obj2 = new Object();
obj2.type = "Fiat";
obj2.model = 500;
この方法はあまり使われません(参考として挙げているだけです)。
③ Object.create() – この方法は初心者にはあまり使われず、主に高度な技術で使用されるため、参考として挙げているだけです
例:
let obj3 = Object.create(null);
obj3.type = "Fiat";
- 渡されたprototypeに基づいて新しいオブジェクトを作成します。
Object.create(null)→ prototypeを持たないオブジェクト、つまり「完全に空の」オブジェクトを作成します。
プロパティ(property)へのアクセス方法
オブジェクト内のプロパティにアクセスする方法は次の2つがあります:
○ Dot notation: keyの名前が正確にわかっている場合はドット.を使用します。
car.type; // "Fiat"
○ Bracket notation: keyが変数である場合や特殊文字を含む場合は[ ... ]を使用します。
car["color"]; // "white"
以上で、オブジェクトの作成方法とオブジェクト内のプロパティへのアクセス方法についての説明を終わります。