オブジェクトとは何か
オブジェクトは「名前（キー）と値（バリュー）の組み合わせ」を入れる“入れ物”です。実世界の「人」「商品」「設定」などを、その属性として表現します。ここが重要です：キーは文字列（やシンボル）、値はあらゆる型（数値・文字列・配列・別オブジェクト・関数）を入れられます。配列が“順番のあるリスト”なのに対し、オブジェクトは“ラベル付きの箱”です。
const user = { id: 1, name: "Alice", active: true };
作り方とプロパティの読み書き
リテラルで作る（もっとも基本）
const product = {
name: "Pen",
price: 120,
inStock: true
};
- ドット記法で読む:
product.name→ “Pen” - ブラケット記法で読む:
product["price"]→ 120（変数キーに便利）
追加・変更・削除
product.color = "blue"; // 追加
product.price = 150; // 変更
delete product.inStock; // 削除
ここが重要です：ブラケット記法はキーが変数のときに有効です。例えば API のフィールド名が動的なら obj[keyVar] を使います。
キー名にスペースや記号がある場合
const record = { "full name": "Alice A." };
console.log(record["full name"]); // ドット不可、ブラケットならOK
ネスト（入れ子）と安全なアクセス
ネストしたオブジェクト
const order = {
id: 100,
customer: { id: 1, name: "Alice" },
items: [{ sku: "A1", qty: 2 }, { sku: "B5", qty: 1 }]
};
console.log(order.customer.name); // "Alice"
console.log(order.items[0].sku); // "A1"
プロパティが“無いかも”への備え（オプショナルチェーン）
// customer が無いときでも安全
const name = order.customer?.name ?? "(unknown)";
ここが重要です：?. は“あったら辿る”。無ければ undefined を返し、クラッシュ（TypeError）を防ぎます。?? は“null/undefined なら右側”の安全な初期値。
メソッド（関数をプロパティにする）と this
メソッドを持つオブジェクト
const counter = {
value: 0,
inc() { this.value++; },
reset() { this.value = 0; }
};
counter.inc();
console.log(counter.value); // 1
ここが重要です：メソッド内の this は「メソッドを呼んだオブジェクト」を指します（counter.inc()なら counter）。アロー関数は this を束縛しないため、メソッド定義には通常の関数記法を使うのが安全です。
参照（シャローコピー）と“同じ箱”問題
オブジェクトは“参照型”
const a = { x: 1 };
const b = a; // 同じオブジェクトを参照
b.x = 999;
console.log(a.x); // 999（a と b は同じ箱）
ここが重要です：代入は“コピー”ではなく“参照の共有”。意図せぬ書き換えを避けるには“新しいオブジェクト”を作ります。
浅いコピー（シャローコピー）
const orig = { user: { id: 1 }, tag: "x" };
const copy1 = { ...orig }; // スプレッド
const copy2 = Object.assign({}, orig);
copy1.tag = "y";
console.log(orig.tag); // "x"（別インスタンス）
// ただし浅いコピーなので中身（user）は共有される
copy1.user.id = 999;
console.log(orig.user.id); // 999（内側は同じ参照）
ここが重要です：深い入れ子まで独立させたいなら“深いコピー”が必要です。簡易なら structuredClone(orig)（対応環境）や JSON 経由（注意点あり）を検討します。
深いコピーの例（構造化クローン）
const deepCopy = structuredClone(orig); // Date/Mapなど多くに対応
反復（ループ）とキーの取得
keys / values / entries
const obj = { a: 1, b: 2 };
console.log(Object.keys(obj)); // ["a", "b"]
console.log(Object.values(obj)); // [1, 2]
console.log(Object.entries(obj)); // [["a",1],["b",2]]
反復して処理
for (const [key, value] of Object.entries(obj)) {
console.log(`${key}=${value}`);
}
ここが重要です：for...in はオブジェクトのキー列挙ですが、順序や継承プロパティの影響に注意。初心者は Object.keys/entries を使い、必要なら hasOwnProperty で“自前のプロパティ”だけに絞ると安全です。
for (const key in obj) {
if (Object.hasOwn(obj, key)) {
// 自身のキーだけ処理（ES2022 の Object.hasOwn）
}
}
JSON とシリアライズ（保存・通信）
オブジェクトを文字列にして送る・保存する
const data = { id: 1, name: "Alice" };
const json = JSON.stringify(data); // '{"id":1,"name":"Alice"}'
const back = JSON.parse(json); // { id: 1, name: "Alice" }
ここが重要です：JSON は「数値・文字列・配列・オブジェクト・true/false/null」を表現できますが、関数・undefined・Symbol は含められません。必要なら変換前に“送れる形”へ整形します。
分割代入・スプレッド（書きやすくする基本技術）
分割代入（取り出しを短く）
const user = { id: 1, name: "Alice", email: "a@x" };
const { id, name } = user; // 取り出し
const { email: contact } = user; // 別名
既定値・ネストの分割
const cfg = { retry: 3 };
const { retry = 1, timeout = 5000 } = cfg; // 無いなら既定値
const settings = { display: { theme: "dark" } };
const { display: { theme = "light" } = {} } = settings;
スプレッドでマージ・上書き
const base = { lang: "ja", theme: "light" };
const override = { theme: "dark" };
const merged = { ...base, ...override }; // { lang:"ja", theme:"dark" }
ここが重要です：右側が優先（後勝ち）。設定の上書きや“部分更新”を非破壊で書けます。
ユーティリティとプロトタイプ（基礎の触り）
よく使うユーティリティ
Object.assign(target, source); // 上書きコピー（浅い）
Object.freeze(obj); // 凍結（変更不可）
Object.hasOwn(obj, key); // 自身のキー判定
Object.fromEntries([["a",1],["b",2]]); // 配列→オブジェクト
ここが重要です：freeze は“再代入禁止”ではなく“中身の変更禁止”。不変にしたい設定オブジェクトなどで有効です。
プロトタイプの超基礎
JavaScript のオブジェクトは“プロトタイプ”を介してメソッドや既定の振る舞いを共有します。初心者はまず「自分で __proto__ を触らない」「クラス構文（class）を使う」から始めると安全です。
class Counter {
constructor() { this.value = 0; }
inc() { this.value++; }
}
const c = new Counter();
c.inc();
よくある落とし穴と回避策（重要ポイントの深掘り）
参照共有で意図せぬ変更
- 浅いコピーでは内側のオブジェクトを共有してしまう。
- 更新は「新インスタンス」を返す（
{ ...obj, key: newVal }）。
動的キーの安全な扱い
- 変数キーはブラケット記法（
obj[keyVar]）。 - 存在しない可能性がある経路は
?.と??で安全に。
ループでの順序と所有判定
- オブジェクトは“順序保証”が仕様的に限定的。表示順が重要なら配列に変換して管理。
Object.hasOwn（またはhasOwnProperty）で継承プロパティを除外。
まとめ
オブジェクトは「キーと値のセット」で現実世界のデータを自然に表現できる基本構造です。ドット／ブラケットで読み書きし、欠損には ?.／??、関数をメソッドとして持たせると振る舞いも表現できます。オブジェクトは参照型なので“コピー＝参照共有”に注意し、更新は非破壊（スプレッド）で。反復は Object.keys/values/entries で配列化して扱い、保存・通信は JSON を使う。分割代入とスプレッドで記述を短く明快にし、ユーティリティ（assign/freeze/hasOwn）を押さえれば、初心者でも安全で読みやすいオブジェクト操作が書けます。
