React入門 練習問題 27：状態管理（配列の不変性）
Reactにおいて、配列データをStateとして管理する際の正しい更新方法はどれか。
- 配列の要素を直接変更し、コンポーネントを再レンダリングする
- 配列の元の要素を直接削除し、自動的に画面を更新する
- 元の配列を直接変更せず、新しい配列を作成してStateを更新する
- 元の配列にpushメソッドを使って要素を追加し、Stateを更新する
- 配列全体を空にすることで、ReactにStateの変更を検知させる
正解と解説を見る
正解：元の配列を直接変更せず、新しい配列を作成してStateを更新する
Reactで配列のStateを更新する場合、元の配列を直接変更せず、新しい配列を作成してStateを更新するのが正しい方法です。
【正解の理由】
ReactはStateの変更を「新しいオブジェクト・配列が生成されたか」で検知するため、スプレッド構文などを用いて新しい配列を作る必要があります。これを不変性（Immutability）と呼びます。
【不正解の理由】
• 「配列の要素を直接変更し、コンポーネントを再レンダリングする」という説明は、直接変更してもReactが変更を検知できず再レンダリングされないため誤り
• 「配列の元の要素を直接削除し、自動的に画面を更新する」という説明は、元の配列を直接操作しているため不適切
• 「元の配列にpushメソッドを使って要素を追加し、Stateを更新する」という説明は、pushメソッドが元の配列を変更する破壊的メソッドであるため誤り
• 「配列全体を空にすることで、ReactにStateの変更を検知させる」という説明は、配列を更新する本来の目的から逸脱しているため誤り