JavaScript「オブジェクトに関する扱い方」要点まとめ
「Working with Objects（オブジェクトの扱い方）」の要点を、初心者向けにギュッと整理しました。
JavaScript オブジェクトの基本まとめ
| 項目 | 要点 | 例 |
|---|---|---|
| 🟢 オブジェクトとは？ | 「キー（名前）と値（value）」のペアを集めた入れ物。 | { name: "Alice", age: 30 } |
| 🏗️ 作り方（生成） | – オブジェクトリテラル {} が最も一般的– new Object() や Object.create(proto) でも作れる | const user = { name: "Bob" } |
| 📖 プロパティの読み書き | – ドット表記 obj.key– 角かっこ表記 obj["key"]（動的アクセス可） | user.name ／ user["age"] |
| ⚙️ メソッド（関数プロパティ） | オブジェクトのプロパティに関数を入れると「メソッド」になる。this がそのオブジェクトを指す。 | { greet() { console.log(this.name) } } |
🪞 this の動作 | 呼び出し方で参照先が変わる。「誰が呼んだか」で決まる。 | obj.method() → this は obj |
| 🔁 オブジェクトのコピーと比較 | – === は「同じ参照か」だけを見る– 中身が同じでも別オブジェクトなら false | {a:1} === {a:1} → ❌ |
| 🧩 プロパティの追加・削除 | – 追加：obj.newKey = "value"– 削除： delete obj.key | delete user.age |
| 🔍 プロパティの存在確認 | "key" in obj または obj.hasOwnProperty("key") | "name" in user |
| 🚪 ゲッター / セッター | プロパティアクセス時に自動的に関数を実行できる。 | js const obj={get x(){...}, set x(v){...}} |
| 🧬 プロトタイプ継承 | オブジェクトは「親オブジェクト（prototype）」を持ち、そこからプロパティやメソッドを引き継ぐ。 | Object.create(proto) |
| 🧱 コンストラクタ関数 | new を使って似たオブジェクトを量産できるテンプレート。 | js function Person(n){this.name=n} new Person("Tom") |
よくある落とし穴
| 落とし穴 | 説明 |
|---|---|
this の参照がずれる | 関数を変数に代入して呼ぶと this が undefined になる |
| オブジェクト比較の誤解 | 中身が同じでも別オブジェクトなら === は false |
| 参照渡し | オブジェクトを代入すると「同じものを共有」する（コピーではない） |
まとめ一言で言うと…
JavaScript のオブジェクトは「名前付きのデータの集まり」であり、
関数も含めて何でも入れられる「万能な入れ物」。
さらに、プロトタイプ継承で他のオブジェクトの性質を引き継げる。