JavaScriptのconstで配列の値は変更できる？初心者がつまずくポイントを解説！

はじめに

JavaScript学習中、constで定義した配列の中身が変更できることに驚いた経験はありませんか？

私もProgateで学んでいる中で

え、constなのに fruits[0] = "grape" が通るの！？

と戸惑いました。
今回はその疑問について、初学者目線で分かりやすく整理してみます。

constの基本とletとの違い

JavaScriptには主に3つの変数宣言の方法があります。

• var：古い書き方、現在はあまり使わない
• let：再代入OK
• const：再代入NG（＝定数）

なので、以下のようなコードはエラーになります：

const x = 10;
x = 20; // ❌ TypeError

「constは変更できない」＝「絶対固定」だと思いがちですが、中身が参照型（オブジェクトや配列）の場合は別なんです。

配列やオブジェクトはなぜ変更OK？

constは「変数への再代入」を禁止しているだけ。
中身の値そのものが変わることには制限をかけていません。

つまり、配列の中身を更新するのはOKというわけです。

const fruits = ["apple", "banana", "orange"];
fruits[0] = "grape"; // ✅ 問題なし！
console.log(fruits); // ["grape", "banana", "orange"]

変えられないのは「配列そのものを他の配列にすること」です。

fruits = ["melon", "peach"]; // ❌ これはNG（再代入）

初心者が混乱しないためのポイント

このあたりの混乱を防ぐために、私自身はこう整理しています：

• const：参照先を固定（＝中身は変わる可能性あり）
• let：再代入も中身の変更も自由
• 配列・オブジェクトの中身の変更は基本OK（constでも）

実際にProgateで出てきた例

Progateでは以下のようなコードが出てきて、私はここで「えっ？」となりました。

const fruits = ["apple", "banana", "orange"];
console.log(fruits[0]); // apple

fruits[0] = "grape";
console.log(fruits[0]); // grape ← ここで衝撃

定数って書き換えられないのでは…！？と思い込んでいたんですね。

まとめ

• constは「再代入不可」であって「中身の変更不可」ではない
• 配列やオブジェクトなどの参照型の中身は変更できる
• 初心者は「中身は変わる」と覚えておこう！

JavaScriptの宣言方法は混乱ポイントが多いですが、理解できると一歩前進した気持ちになりますね。
この記事が同じように迷った誰かのヒントになれば嬉しいです🌷