プロパティの追加とは何か
オブジェクトの「プロパティ」は、キー（名前）と値のペアです。プロパティの追加は、既存のオブジェクトに新しいキーと値を付け足すことを指します。重要なのは「オブジェクトは後からでも自由に拡張できる」点で、設定値の追加や新しい振る舞い（メソッド）の付与が簡単にできます。
基本の追加方法（ドット記法とブラケット記法）
ドット記法は読みやすく、ブラケット記法は動的なキーや記号を含むキーに向いています。
const user = { name: "太郎" };
// ドット記法（静的キー）
user.age = 20;
console.log(user.age); // 20
// ブラケット記法（動的キー・文字列キー）
const key = "fav-color";
user[key] = "blue";
console.log(user["fav-color"]); // blue
ここが重要です：キーがコード上で固定ならドット記法、変数で決まる・ハイフンやスペース等を含むならブラケット記法を使い分けます。
追加と更新の違い（同じ書き方で挙動が変わる）
同じ「代入」の書き方でも、キーが存在しなければ追加、存在すれば更新になります。
const user = {};
user.city = "東京"; // 追加
user.city = "大阪"; // 更新
console.log(user.city); // 大阪
初めてのキーに代入するとその場でプロパティが作られます。既存キーなら値が置き換えられます。
生成時にまとめて追加（オブジェクトリテラルと計算済みキー）
作成時にまとめてプロパティを定義すると、初期状態が明確になります。動的なキーは「計算済みプロパティ名」を使えます。
const field = "score";
const user = {
name: "花子",
age: 21,
[field]: 95 // 作成時に動的にキーを決定
};
console.log(user.score); // 95
ここが重要です：初期化の段階で必要なプロパティを明示しておくと、後からの追加よりも「何があるべきか」が読み手に伝わりやすくなります。
メソッドの追加（振る舞いを後から足す）
値だけでなく関数（メソッド）も追加できます。メソッド内で自分自身のデータにアクセスするときは this を使います。
const user = { name: "太郎" };
// メソッドを後から追加
user.greet = function () {
return `こんにちは、${this.name}`;
};
console.log(user.greet()); // こんにちは、太郎
ここが重要です：メソッド本体は通常の関数記法が安全です。アロー関数は独自の this を持たないため、期待どおりに this が動かないことがあります。
const でもプロパティは追加できる（参照は固定、中身は可変）
const は「変数に入っている参照を再代入できない」だけで、オブジェクトの中身（プロパティ）は変更・追加できます。
const user = { name: "太郎" };
user.age = 20; // 追加は可能
// user = { name: "花子" }; // これは再代入でエラー
console.log(user.age); // 20
ここが重要です：const は「箱の差し替え禁止」、プロパティの追加・更新は「箱の中身の変更」。混同しないように直感を持ちましょう。
入れ子への安全な追加（途中が未定義のときの対処）
深いプロパティへ追加する場合、途中のオブジェクトが存在しないとエラーになります。途中を作りながら追加します。
const user = {};
// user.profile.city = "東京"; // ここはエラー（profileが未定義）
user.profile = {}; // 途中を作る
user.profile.city = "東京"; // 追加完了
オプショナルチェーン ?. は参照には便利ですが、代入では使えません。代入が必要なら「存在チェック→作成→代入」の順で安全に進めます。
プロパティの属性を指定して追加（書き換え不可・列挙不可）
通常の代入では「書き込み可・変更可・列挙可」のプロパティが作られます。厳密な制御が必要なら Object.defineProperty を使います。
const config = {};
Object.defineProperty(config, "version", {
value: "1.0.0",
writable: false, // 書き換え不可
enumerable: false, // for...inやObject.keysに出ない
configurable: false
});
console.log(config.version); // 1.0.0
config.version = "2.0.0"; // 変更されない
console.log(Object.keys(config)); // []
ここが重要です：公開したくない設定や、絶対に変えられたくない値には属性制御が有効です。
追加の可視性と影響範囲（参照共有に注意）
オブジェクトは参照型なので、同じ参照を共有する全ての変数から追加したプロパティが見えます。
const a = { n: 1 };
const b = a; // 参照共有
b.flag = true; // bから追加
console.log(a.flag); // true（aからも見える）
ここが重要です：共有している意識がないと「どこで追加されたのか」が分かりづらくなります。外部から見えるオブジェクトにプロパティを追加する前に、影響範囲を考えましょう。必要ならコピー（浅いコピーや深いコピー）で独立させます。
まとめ
- プロパティの追加は「代入するだけ」ででき、キーがなければ新規、あれば更新になります。
- ドット記法は静的キー、ブラケット記法は動的・特殊キーに使い分け。
constでも中身の追加は可能（参照は固定だが内容は変更可）。- 入れ子に追加する際は途中を作ってから代入する。
- 厳密な制御が必要なら
Object.definePropertyで属性を指定。 - 参照共有による影響範囲に注意し、必要ならコピーしてから追加する。
この感覚さえ掴めば、設定オブジェクトやデータモデルの拡張が直感的にでき、壊れにくい設計に近づけます。