多次元配列とは？
JavaScriptでは、配列の中に別の配列を格納できます。このような配列を多次元配列と呼びます。
最もよく使われるのは2次元配列です。2次元配列は、表のように「行」と「列」でデータを管理したい場合に便利です。
多次元配列の基本例
const matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
console.log(matrix[0]);
console.log(matrix[1][2]);
この例では、matrixという2次元配列を定義しています。
matrix[0]は1行目の配列である[1, 2, 3]を表します。matrix[1][2]は、2行目の3番目の要素である6を表します。
多次元配列の構造
多次元配列は、配列の中にさらに配列が入っている構造です。
| インデックス | 格納されている要素 |
|---|---|
matrix[0] |
[1, 2, 3] |
matrix[1] |
[4, 5, 6] |
matrix[2] |
[7, 8, 9] |
このように、外側の配列には複数の配列が格納されています。内側の配列を「行」と考えると、表形式のデータとして理解しやすくなります。
多次元配列の要素にアクセスする
多次元配列の要素にアクセスするには、インデックスを複数指定します。
2次元配列の場合は、最初のインデックスで外側の配列、次のインデックスで内側の配列の要素を指定します。
多次元配列の要素にアクセスする例
const matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
console.log(matrix[0][1]);
console.log(matrix[2][2]);
この例では、matrix[0][1]で1行目の2番目の要素である2にアクセスしています。
また、matrix[2][2]では3行目の3番目の要素である9にアクセスしています。
多次元配列の要素の変更
多次元配列の要素を変更する場合も、アクセスするときと同じようにインデックスを指定します。
多次元配列の要素を変更する例
const matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
matrix[1][2] = 10;
console.log(matrix);
この例では、matrix[1][2]の値を10に変更しています。
matrix[1][2]は2行目の3番目の要素なので、元の値である6が10に置き換わります。
多次元配列の利用例
多次元配列は、表形式のデータや座標、ゲームのマップなどを管理するときに役立ちます。
座標を多次元配列で管理する例
const coordinates = [
[10, 20],
[30, 40],
[50, 60]
];
console.log(coordinates[0]);
console.log(coordinates[1][1]);
この例では、各座標を[x, y]の形で管理しています。
coordinates[1][1]は、2番目の座標のyの値である40を表します。
表形式のデータを管理する例
const scores = [
["Taro", 80, 90],
["Hanako", 95, 88],
["Jiro", 70, 85]
];
console.log(scores[0][0]);
console.log(scores[1][2]);
この例では、名前と点数を2次元配列で管理しています。
scores[0][0]は"Taro"、scores[1][2]は88を表します。
多次元配列をループで処理する
多次元配列は、for...of文を使って順番に処理できます。
const matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
for (const row of matrix) {
for (const value of row) {
console.log(value);
}
}
外側のfor...of文で行を取り出し、内側のfor...of文で各行の要素を取り出しています。
多次元配列を扱うときは、「外側の配列」と「内側の配列」を意識すると理解しやすくなります。
初心者が覚えておきたいポイント
- 多次元配列は、配列の中に配列が入っている構造です。
- 2次元配列は、表のようなデータを扱うときに便利です。
matrix[0]は1行目の配列を表します。matrix[0][1]のように書くと、内側の配列の要素にアクセスできます。- JavaScriptの配列は行ごとに長さが違っていても構いません。
- データが複雑になりすぎる場合は、オブジェクトの配列を使う方が分かりやすいこともあります。
まとめ
- 多次元配列は、配列の中にさらに配列を格納した構造である。
- 2次元配列は、表形式のデータを扱うときに便利である。
- 要素にアクセスするには、複数のインデックスを指定する。
- 要素を変更する場合も、アクセス時と同じようにインデックスを指定する。
for...of文を使うと、多次元配列を順番に処理しやすい。- 複雑なデータでは、多次元配列よりオブジェクトの配列が適している場合もある。