JavaScriptでの多次元配列(2次元配列)の扱いをまとめてみた

最近授業でPHPによる多次元配列を扱ったりするのですが、JavaScriptではどう処理するのか気になったのでまとめてみました。

そもそも多次元配列とは何か
JavaScriptで2次元配列を扱う
1. 2次元配列の生成
2. 2次元配列へのアクセス

そもそも多次元配列とは何か

「多次元配列」と聞いて、ピンとくる方もこない方もいらっしゃると思うので、説明したいと思います。例えば、以下の様な表をイメージしてください。

	1	2	3	4
1	100	200	300	400
2	500	600	700	800
3	900	1,00	1,100	1,200
4	1,300	1,400	1,500	1,600

Excelで表を作る際、こんな感じになるのでは無いでしょうか。上の表のように、2つの添字を指定して値を指定できる配列を「2次元配列」と言います。「3次元配列」や「4次元配列」もあり、それらを総称して「多次元配列」と呼びます。

JavaScriptで2次元配列を扱う

2次元配列は以下のようにして作ります。

2次元配列の生成


    var array01 = [100, 200, 300, 400];
    var array02 = [500, 600, 700, 800];
    var array03 = [900, 1000, 1100, 1200];
    var array = [array01, array02, array03];

var array01 = [100, 200, 300, 400];

var array02 = [500, 600, 700, 800];

var array03 = [900, 1000, 1100, 1200];

var array = [array01, array02, array03];

あるいはまとめて以下の様な記述も可能です。


    var array = [
    [100, 200, 300, 400],
    [500, 600, 700, 800],
    [900, 1000, 1100, 1200]
    ];

var array = [

[100, 200, 300, 400],

[500, 600, 700, 800],

[900, 1000, 1100, 1200]

];

2次元配列へのアクセス

2次元配列は以下のようにしてアクセスできます。


    var array = [
    [100, 200, 300, 400],
    [500, 600, 700, 800],
    [900, 1000, 1100, 1200]
    ];
    var num = array[0][0];

var array = [

[100, 200, 300, 400],

[500, 600, 700, 800],

[900, 1000, 1100, 1200]

];

var num = array[0][0];

上記は、変数numに100を代入した処理です。あっ大事なことを言い忘れていましたが、配列は0から始まるので、1列目の1行目を指定する場合[0][0]と指定してあげなければいけません。では、簡単なサンプルを試して実際2次元配列を使ってみます。


var array = [
      [100, 200, 300, 400],
      [500, 600, 700, 800],
      [900, 1000, 1100, 1200]
      ];
      for (var i = 0; i &lt; 3; i++){
    document.write("&lt;p&gt;");

    for (var j = 0; j &lt; 4; j++){
      document.write("[" + i + "][" + j + "] = " + array[i][j] + "&lt;br&gt;");
    }

    document.write("&lt;/p&gt;");
  }