Day7 配列の練習問題
Day7 のテーマは 配列 / push / splice。
ここでは、配列操作の理解を深めるための練習問題と、
それぞれの解答・解説をまとめていきます。
配列は JavaScript の中でも使用頻度が非常に高いので、
ここでしっかり手を動かして「扱える感覚」を身につけましょう。
配列の基本操作の練習問題
問題1：配列を作って中身を表示する
次のフルーツを含む配列 fruits を作り、
0 番目・1 番目・2 番目の要素を表示してください。
"apple", "banana", "orange"
解答例
const fruits = ["apple", "banana", "orange"];
console.log(fruits[0]);
console.log(fruits[1]);
console.log(fruits[2]);
解説
配列は [] で作り、
要素は 0 から数える（インデックス） のが重要ポイントです。
問題2：length を使って配列の長さを表示する
fruits 配列の長さを表示してください。
解答例
const fruits = ["apple", "banana", "orange"];
console.log(fruits.length);
解説
length は「配列の要素数」を返すプロパティです。
配列を扱うときは length を使うのが基本です。
push の練習問題
問題3：配列の最後に要素を追加する
fruits 配列に "grape" を追加し、
追加後の配列を表示してください。
解答例
const fruits = ["apple", "banana", "orange"];
fruits.push("grape");
console.log(fruits);
解説
push は 配列の末尾に要素を追加するメソッド です。
元の配列が直接書き換わる点が重要です。
問題4：push した後の length を確認する
fruits に "melon" を push し、
追加前と追加後の length を表示してください。
解答例
const fruits = ["apple", "banana", "orange"];
console.log(fruits.length);
fruits.push("melon");
console.log(fruits.length);
解説
push すると length が 1 増えます。
配列の変化を追うときは length を確認する習慣が大切です。
splice の練習問題（削除・追加・置き換え）
問題5：splice で要素を削除する
次の配列から "banana" を削除してください。
const fruits = ["apple", "banana", "orange"];
解答例
const fruits = ["apple", "banana", "orange"];
fruits.splice(1, 1);
console.log(fruits); // ["apple", "orange"]
解説
splice(開始位置, 削除数)
開始位置 1 → “banana”
削除数 1 → 1つ削除
splice は 元の配列を直接変更する（破壊的メソッド） です。
問題6：splice で途中に追加する
次の配列の "banana" の前に "grape" を追加してください。
const fruits = ["apple", "banana", "orange"];
解答例
const fruits = ["apple", "banana", "orange"];
fruits.splice(1, 0, "grape");
console.log(fruits); // ["apple", "grape", "banana", "orange"]
解説
削除数を 0 にすると「削除せずに追加」になります。
splice は「途中に差し込む」ことができる強力なメソッドです。
問題7：splice で置き換える
次の配列の "banana" を "melon" に置き換えてください。
const fruits = ["apple", "banana", "orange"];
解答例
const fruits = ["apple", "banana", "orange"];
fruits.splice(1, 1, "melon");
console.log(fruits); // ["apple", "melon", "orange"]
解説
削除数 1 → “banana” を削除
追加 → “melon” を挿入
結果として「置き換え」になります。
応用問題（配列＋繰り返し＋splice）
問題8：偶数だけを削除する
次の配列から偶数をすべて削除してください。
const numbers = [1, 2, 3, 4, 5, 6];
解答例
const numbers = [1, 2, 3, 4, 5, 6];
for (let i = 0; i < numbers.length; i = i + 1) {
if (numbers[i] % 2 === 0) {
numbers.splice(i, 1);
i = i - 1; // インデックスのズレを補正
}
}
console.log(numbers); // [1, 3, 5]
解説
splice で削除すると配列が縮むため、
次の要素を正しくチェックするために i を 1 減らす 必要があります。
配列操作の中でもつまずきやすいポイントなので、
ここはしっかり理解しておきましょう。
セキュリティ視点の確認問題
問題9：範囲外アクセスの危険性を理解する
次のコードの出力を予想し、
なぜその結果になるか説明してください。
const users = ["Taro", "Hanako"];
console.log(users[5]);
解答と解説
出力は undefined です。
JavaScript では範囲外アクセスはエラーにならず undefined を返します。
しかし「あると思っていたデータが undefined」になると、
認証処理や権限チェックで重大なバグにつながります。
配列を扱うときは length を使って範囲を確認する習慣 が重要です。
Day7 練習問題まとめ
Day7 の練習で身につくことは次の通りです。
配列の基本（インデックス・length）
push で末尾に追加
splice で途中の削除・追加・置き換え
splice の破壊的動作とインデックスのズレ
範囲外アクセスの危険性
配列はこの先の「オブジェクト」「関数」「API」「データ処理」など
あらゆる場面で使う基礎スキルです。
