JavaScriptで指定した行数・列数・値から2次元配列を作成する方法

概要

JavaScriptでは、指定した条件に基づいて多次元配列を動的に生成したいケースがよくあります。本記事では、3つの引数を受け取り、それらをもとに2次元配列を構築する関数の実装方法を解説します。

関数は以下の3つの引数を受け取ります。

• row：配列に含まれるサブ配列（行）の数
• col：各サブ配列に含まれる要素（列）の数
• val：各要素に格納する値

入出力例

たとえば、引数として「2, 3, 10」を渡した場合、行数2・列数3・すべての要素の値が10の2次元配列が生成されます。

const output = [[10, 10, 10], [10, 10, 10]];

実装コード

以下が実際のコードです。

const row = 2;
const col = 3;
const val = 10;

const constructArray = (row, col, val) => {
    const res = [];
    for(let i = 0; i < row; i++){
        for(let j = 0; j < col; j++){
            if(!res[i]){
                res[i] = [];
            };
            res[i][j] = val;
        };
    };
    return res;
};

console.log(constructArray(row, col, val));

コードの解説

外側のループで行数（row）の回数だけ繰り返し、内側のループで列数（col）の回数だけ繰り返します。res[i] がまだ存在しない場合は空の配列で初期化してから値を代入することで、目的のサイズの2次元配列を安全に構築できます。

実行結果

このコードを実行すると、コンソールには次のように出力されます。

[ [ 10, 10, 10 ], [ 10, 10, 10 ] ]

補足：Array.from を使ったより簡潔な書き方

ループ処理を明示的に書かずに、Array.from() を使えば1行で同じ結果を得ることもできます。

const constructArray = (row, col, val) => 
  Array.from({ length: row }, () => Array(col).fill(val));

console.log(constructArray(2, 3, 10));
// [[10, 10, 10], [10, 10, 10]]

用途や可読性の好みに応じて、どちらの方法でも柔軟に対応できます。