では、多次元配列を初心者向けに分かりやすく、例題付きで解説します。
「配列の中に配列が入っている状態」をイメージして進めます。
1) 多次元配列って何?
- 普通の配列:1列の値を持つ箱
let arr = [1,2,3];
JavaScript- 多次元配列:配列の中に配列が入っている
let matrix = [
[1, 2, 3], // 1行目
[4, 5, 6], // 2行目
[7, 8, 9] // 3行目
];
JavaScript- イメージ:
行\列 0 1 2
0 1 2 3
1 4 5 6
2 7 8 9
- アクセス方法:
matrix[行番号][列番号]
console.log(matrix[0][1]); // 2(1行目・2列目)
console.log(matrix[2][0]); // 7(3行目・1列目)
JavaScript2) ループ処理で全要素を順番に取り出す
forループを二重に使う
for (let i = 0; i < matrix.length; i++) {
for (let j = 0; j < matrix[i].length; j++) {
console.log(matrix[i][j]);
}
}
JavaScript出力:
1
2
3
4
5
6
7
8
9
for…of でも簡単に
for (let row of matrix) {
for (let val of row) {
console.log(val);
}
}
JavaScript3) 練習例1:合計値を求める
let sum = 0;
for (let row of matrix) {
for (let val of row) {
sum += val;
}
}
console.log('合計:', sum); // 合計: 45
JavaScript4) 練習例2:各行の平均を求める
for (let i = 0; i < matrix.length; i++) {
let row = matrix[i];
let rowSum = row.reduce((acc, v) => acc + v, 0);
console.log(`行${i+1}の平均:`, rowSum / row.length);
}
JavaScript出力:
行1の平均: 2
行2の平均: 5
行3の平均: 8
5) さらに応用:行列を表示
for (let row of matrix) {
console.log(row.join(' ')); // 空白で区切って1行ずつ表示
}
JavaScript出力:
1 2 3
4 5 6
7 8 9
6) 多次元配列のポイント
- 配列の中に配列が入っている →
matrix[行][列]でアクセス lengthは 行数 か その行の列数 を調べるときに使える- ネストされたループ(for の中に for)や
for...ofを使うと全要素を扱える - 3次元配列(配列の中に配列の中に配列)も同じイメージで、ループをもう一段増やせば扱える
練習問題(手を動かしてみよう)
問題1
次の配列の最大値を求めよ:
let data = [
[10, 20, 5],
[3, 15, 8],
[7, 12, 25]
];
JavaScript解答例
let max = data[0][0];
for (let row of data) {
for (let val of row) {
if (val > max) max = val;
}
}
console.log('最大値:', max); // 25
JavaScript問題2
3×3の行列の各列の合計を求めよ:
let mat = [
[1,2,3],
[4,5,6],
[7,8,9]
];
JavaScript解答例
let cols = mat[0].map(() => 0); // 列数分の0配列
for (let row of mat) {
for (let j = 0; j < row.length; j++) {
cols[j] += row[j];
}
}
console.log('列ごとの合計:', cols); // [12,15,18]
JavaScript

