JavaScriptオブジェクトの基本まとめ
📝 目次
オブジェクトとは？
- オブジェクトは「プロパティ（key: value）」の集まりです。
- キー（key）と値（value） がペアになったデータ構造です。
- 配列のようなインデックス番号でのアクセスではなく、キー名で値を管理・参照します。
💡 例えば「商品情報」や「ユーザー情報」など、名前付きの複数データを1つにまとめたい時によく使います。
オブジェクトリテラルの書き方
オブジェクトはオブジェクトリテラル（{}で囲む）で定義します。
値にはどんなデータ型でも格納できます。
const product = {
name: 'Ice Cream',
inStock: true,
price: 198,
flavors: ['grape', 'apple', 'cherry'],
};
- プロパティ名（キー）は文字列（シングル/ダブルクォートなしでもOK。数字開始や空白は不可）
- 値には文字列・数値・真偽値・配列・オブジェクト・関数など何でも入れられます
オブジェクトから値を取得する方法
オブジェクトの値には2通りのアクセス方法があります。
const person = {
firstName: 'Taro',
lastName: 'Yamada',
};
// ドット記法（一般的！）
console.log(person.firstName); // 'Taro'
// ブラケット記法（キー名を文字列で指定する場合など）
console.log(person['firstName']); // 'Taro'
💡 どちらでもアクセスできるが、キー名に空白や記号がある場合はブラケット記法が必須です。
キーとデータ型の扱いに注意
-
オブジェクトのキーは原則「文字列」型に変換されます（
Symbolを除く）
const years = {
1999: 'good',
2020: 'bad',
};
console.log(years[1999]); // 'good'（1999 → '1999'に変換される）
console.log(years['1999']); // 'good'
⚠️ 数値リテラルで定義しても内部では文字列のキーになります。
値の参照・更新・追加
オブジェクトの値は参照・更新・新規追加も柔軟にできます。
const midterms = {
taro: 96,
jiro: 78,
};
// 値の更新
midterms.jiro = 79;
console.log(midterms.jiro); // 79
// プロパティの追加
midterms.saburo = 100;
console.log(midterms);
// { taro: 96, jiro: 79, saburo: 100 }
- 存在するキーに再代入すれば更新、新しいキーを使えば追加されます
配列とオブジェクトの違い
| 配列（Array） | オブジェクト（Object） | |
|---|---|---|
| 主な用途 | 順序のあるリスト | 名前付きの値の集まり |
| アクセス方法 | インデックス番号（0, 1, 2, ...） | キー名（'name', 'price', ...） |
| 宣言例 | let colors = ['red', 'blue']; |
let product = {name: 'Ice Cream'}; |
| 拡張性 | 要素の順序が大事なリストに最適 | それぞれの値に「名前」をつけたい場合に便利 |
まとめ
- オブジェクトは 「キー:値」 のセットでデータを管理する構造
- 配列は順序重視、オブジェクトはラベル（名前）重視で使い分ける
- 値の取得・更新・追加は簡単にできる
- キーは内部的に「文字列」型に変換される点に注意