こんにちは！日々の開発、本当にお疲れ様です。
JavaScriptの学習を進めていくと、早い段階で `const` というキーワードに出会いますよね。「変数の値を変更不可（定数）にするもの」として覚えた方がほとんどだと思います。
でも、少し慣れてくるとこんな疑問が湧きんせんか？
「あれ？ `const` で宣言したオブジェクトなのに、中のプロパティは普通に変更できちゃうぞ……？ これって不変（イミュータブル）じゃないの？」
実はここ、JavaScript初学者だけでなく、他の堅牢なプログラoming言語からやってきた開発者が最も誤解しやすい「深い罠」が潜んでいるポイントなんです。
今回は、単なる文法の解説にとどまらず、JavaScriptが動く裏側の世界――ブラウザの心臓部であるV8エンジンがメモリをどう扱い、最適化をどう行っているのかという極限の知見まで、一緒に解き明かしていきましょう。ここをクリアすれば、あなたの書くコードのパフォーマンスと信頼性は見違えるほど変わりますよ！
—
1. `const` の正体：値の固定ではなく「バインディング」の固定
まずは基本のおさらいから優しく紐解いていきましょう。
`const` は、変数名とメモリ上のアドレスを結びつける「バインディング（結合）」を固定するキーワードです。
言葉だけだと難しいので、身近な例えで考えてみましょう。
`const` でオブジェクトを宣言することは、「鍵付きのロッカー（変数）に、特定のダンボール箱（オブジェクト）を入れた状態」を想像してください。
// ダンボール箱をロッカーにしまう（constで宣言）
const user = {
name: ‘Taro’,
age: 25
};
// 【エラーにならない】ダンボール箱の中身（プロパティ）を書き換える
user.age = 26;
console.log(user.age); // 26 出力されます
// 【エラーになる】ロッカーの中に、別の新しいダンボール箱を入れようとする
// user = { name: ‘Jiro’, age: 30 }; // TypeError: Assignment to constant variable.
そうなんです！ `const` が守っているのは、あくまで「ロッカーに別の箱を入れられないこと（再代入の禁止）」だけ。箱の中身を入れ替えたり、メモ書きを書き加えたりする行為は、ロッカーの鍵とは関係がないので自由にできてしまうんですね。これが「const＝完全な不変」という誤解の正体です。
—
2. 【本丸】オブジェクトの変更がV8エンジンの「隠しクラス（Hidden Class）」を破壊する
ここからが、今回の記事の最もエキサイティングな上級編です。
「中身のプロパティを変更できるなら、別にいいじゃないか」と思いますよね？ いいえ、ここにJavaScriptのパフォーマンスを劇的に落とす静かなる恐怖が潜んでいます。
JavaScriptは動的言語です。「プロパティをいつでも自由に追加・削除できる」という素晴らしい柔軟性を持っていますが、C++やJavaのような静的言語と違って、そのままではCPUがメモリ上のどこに何があるか即座に理解できません。
そこで、Google ChromeやNode.jsで使われているV8エンジンは、「隠しクラス（Hidden Class / Shapes）」という裏技を使って、裏側で勝手にオブジェクトの設計図を推論し、最適化を行っています。
隠しクラスの裏側を覗いてみよう
例えば、次のようなコードを実行したとします。
// パフォーマンスを意識したオブジェクトの生成
const createPoint = (x, y) => {
const obj = {};
obj.x = x; // ここで隠しクラスAが生成される
obj.y = y; // ここで隠しクラスBに移行する
return obj;
};
const p1 = createPoint(10, 20);
const p2 = createPoint(30, 40);
V8エンジンは、`p1` と `p2` がまったく同じ順序でプロパティを持っているため、「おっ、こいつらは同じ設計図（隠しクラス）だな！」と判断し、メモリ上の読み込みを高速化（インラインキャッシュなどによる最適化）します。
では、後から勝手に構造を変えるとどうなるか？
もし、次のように後から動的にプロパティを追加したり、順序をバラバラにしたりするとどうなるでしょうか。
const userA = { name: ‘Taro’, age: 25 };
const userB = { age: 30 }; // 最初からnameがない
// 後から無理やりプロパティを追加！
userB.name = ‘Jiro’;
人間から見れば `userA` も `userB` も最終的に同じ形ですが、V8エンジンにとっては大パニックです。「あれ？ `userB` は途中で設計図を変更したぞ！ さっきまでの最適化ルールが使えないから、もう一度メモリの構造を再計算（ディアソシエーション）しなきゃ……！」と、CPUに重い負荷がかかります。
これが、無計画なオブジェクトのミュータブル（可変）な操作が、V8エンジンの最適化をリセットしてしまうメカニズムです。
—
3. イミュータブル（不変）な設計がもたらす圧倒的な恩恵
こうしたV8エンジンの挙動を知ると、「なぜモダンなJavaScript/TypeScript開発やReactなどのフレームワークで、イミュータブルな設計が強く推奨されるのか」の理由が見えてきます。
イミュータブルな設計とは、オブジェクトのプロパティを直接書き換えるのではなく、「変更を加えた新しいオブジェクトを常に新しく生み出す」というアプローチです。
const originalUser = { name: ‘Taro’, age: 25 };
// ❌ やってはいけない例（ミュータブルな変更）
// originalUser.age = 26;
// ⭕ 推奨される例（スプレッド構文を使ったイミュータブルな更新）
const updatedUser = {
…originalUser, // 既存の構造をそのままコピー（V8の隠しクラスを維持しやすい）
age: 26 // 変更したい部分だけ上書き
};
このように、最初から「形状が変わらない（あるいは予測可能な変化をする）」オブジェクトとして扱うことで、V8エンジンは安心してメモリの最適化を維持し続けることができます。
さらに、アプリケーションの観点からも、「いつ、どこで、誰がデータ書き換えたのか分からない！」というバグ（予測不可能な副作用）から解放されるため、コードの保守性が劇的に向上するという大きなメリットも生まれます。
—
まとめ：今日の学びをあなたの武器に
いかがでしたでしょうか？ 今回の重要なポイントをスッキリ整理しておきましょう。
1. `const` は値の不変性を保証するものではなく、再代入を防ぐバインディングの固定である。
2. オブジェクトのプロパティを後から自由に変更・追加しすぎると、V8エンジンの「隠しクラス」が破壊され、パフォーマンスが低下する。
3. スプレッド構文などを活用したイミュータブルな設計は、コードの安全性を高めるだけでなく、V8の最適化エンジンにとっても非常に優しい。
「たかが変数宣言、されど変数宣言」。
こうした言語のランタイムやエンジンの挙動まで意識してコードを書けるようになると、あなたの書くJavaScriptはワンランク上の、プロフェッショナルな代物へと生まれ変わります。
ここをクリアしたあなたなら、どんな複雑なモダンフロントエンドのアーキテクチャも怖くありません。ぜひ、日々のコーディングで「V8エンジンがどう喜ぶか」を少しだけ意識してみてくださいね。それでは、また次回の深掘り記事でお会いしましょう！