先生と生徒の会話形式で理解しよう

生徒

「先生、JavaScriptでたくさんの数値を扱うとき、配列を使うと便利だと聞きました。でもどうやって使えばいいですか？」

先生

「数値を配列で扱うと、複数の値をまとめて管理できたり、計算や操作を効率よく行えます。基本から便利なテクニックまで順番に見ていきましょう。」

生徒

「なるほど。まず基本の使い方から教えてください。」

先生

「はい、それでは配列の基本的な作り方と操作方法を見てみましょう。」

1. 数値配列の基本

JavaScriptでは、複数の数値をまとめて扱うには配列（Array）を使います。配列は角かっこ [] で作成し、数値をカンマで区切って並べます。


let numbers = [10, 20, 30, 40, 50];
console.log(numbers);


[10, 20, 30, 40, 50]

このように配列に数値をまとめると、インデックス（順番を示す番号）を使って個別の値にアクセスできます。


console.log(numbers[0]); // 10
console.log(numbers[3]); // 40

2. 配列の便利な操作メソッド

JavaScriptの配列には、数値を効率よく操作するための便利なメソッドが多数あります。代表的なものをいくつか紹介します。

配列の最後に新しい値を追加できます。


numbers.push(60);
console.log(numbers);


[10, 20, 30, 40, 50, 60]

配列の最後の値を取り出して削除できます。


let last = numbers.pop();
console.log(last);   // 60
console.log(numbers);


[10, 20, 30, 40, 50]

配列内の数値すべてに計算を適用できます。例えば、すべての値を2倍にする場合:


let doubled = numbers.map(num => num * 2);
console.log(doubled);


[20, 40, 60, 80, 100]

配列内の数値のうち条件に合うものだけを取り出せます。


let over30 = numbers.filter(num => num > 30);
console.log(over30);


[40, 50]

配列の値をまとめて1つの値にする場合は reduce() が便利です。合計や平均を求めるときによく使います。


let sum = numbers.reduce((acc, val) => acc + val, 0);
console.log(sum); // 150

let avg = sum / numbers.length;
console.log(avg); // 30

配列の数値を順番に処理したい場合、ループを使います。for ループと for...of が便利です。


// forループ
for (let i = 0; i < numbers.length; i++) {
  console.log(numbers[i]);
}

// for...of
for (let num of numbers) {
  console.log(num);
}

配列をコピーして別の変数で扱う場合、スプレッド構文 ... を使うと便利です。


let copy = [...numbers];
copy.push(60);
console.log(numbers); // 元の配列は変更されない
console.log(copy);    // コピーは60追加

2次元配列や多次元配列を使えば、表形式で数値を整理できます。例えば行列の計算やデータ管理に便利です。


let matrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

console.log(matrix[1][2]); // 6

配列を操作する際は、元の配列を意図せず変更しないように注意が必要です。必要に応じてコピーして操作すると安全です。また、配列が大きくなる場合は、処理速度を意識したループやメソッドの選択が重要です。