JavaScript
📋 配列のコピーが元の配列も変わる
参照のコピーになっている
😰 こんな症状
配列をコピーして変更したら元の配列も変わってしまった。参照の仕組みが原因だよ。
🔍 原因
const copy = original のように代入すると、配列の中身ではなく「参照(メモリ上の場所)」がコピーされるよ。copy と original は同じ配列を指しているので、片方を変更するともう片方も変わるんだ。
❌ エラーが起きるコード
const original = [1, 2, 3];
const copy = original;
copy.push(4);
console.log(original); // [1, 2, 3, 4] 元も変わる ✅ 直し方
1. スプレッド構文でコピーする: const copy = [...original] 2. Array.from() を使う: const copy = Array.from(original) 3. ネストした配列は structuredClone() で深いコピーをする。
✅ 修正後のコード
const original = [1, 2, 3];
const copy = [...original];
copy.push(4);
console.log(original); // [1, 2, 3] 元は変わらない この解決法は役立ちましたか?
🔗 関連するエラー
- Uncaught ReferenceError: xxx is not defined — 変数・関数名のタイポ
- Uncaught TypeError: Cannot read properties of null — getElementById の id が存在しない
- 404 Not Found(スクリプトが読み込まれない) — script の src パスが間違っている
- ボタンを押しても何も起きない — getElementById の id 不一致
- 計算結果が NaN になる — 文字列を数値に変換していない
📖 この問題を学べるレッスン
📝 関連ブログ記事
- プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
- JavaScriptとは?初心者向けにわかりやすく解説 — 変数・関数・イベントの基本
- JavaScriptでボタンクリックを動かす方法 — ボタンクリック時の動作を解説