JavaScriptでネストされた配列を文字列に変換する方法

JavaScriptでは、リテラル（文字列や数値など）が入れ子になった配列を受け取り、その中に含まれるすべての値を連結して1つの文字列に変換する関数が必要になる場面があります。本記事では、再帰処理を使って、どれだけ深くネストした配列でもフラットな文字列に変換できる実装方法を解説します。

ネストされた配列の例

まず、次のような多次元配列を用意しました。配列の中にさらに配列が含まれている構造です。

const arr = [
    'hello', [
        'world', 'how', [
            'are', 'you', [
                'without', 'me'
            ]
        ]
    ]
];

解決策：再帰関数による実装

ポイントは Array.isArray() メソッドです。このメソッドを使えば、各要素が配列かどうかを判定できます。要素が配列であれば自分自身を再帰的に呼び出し、そうでなければそのまま文字列として連結します。

const arrayToString = (arr) => {
    let str = '';
    for(let i = 0; i < arr.length; i++){
        if(Array.isArray(arr[i])){
            str += arrayToString(arr[i]);
        }else{
            str += arr[i];
        }
    }
    return str;
};
console.log(arrayToString(arr));

コードの仕組み

• ループで配列の各要素を順番に取り出します。
• Array.isArray() で要素が配列かどうかをチェックします。
• 配列の場合は、その配列に対して同じ関数を再帰的に実行し、内部の値もすべて処理します。
• 配列以外の値（リテラル）は、そのまま結果の文字列に連結されます。

このアプローチにより、ネストの階層が何段であっても柔軟に対応できます。

実行結果

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

helloworldhowareyouwithoutme

すべてのネストされた値が順序通りに連結され、1つの文字列になっていることが確認できます。