ライブラリ関数を使わずに真偽値を含むネスト配列をフラット化する方法 - JavaScript

JavaScriptで、falseやnullといった偽値を含むネストされた配列を受け取り、ネストを一切含まない平坦な配列を返す関数を作成する必要があります。

たとえば、入力が次の場合 −

const arr = [[1, 2, 3], [4, 5, [5, false, 6, [5, 8, null]]], [6]];

期待される出力は次のとおりです −

const output = [1, 2, 3, 4, 5, false, 6, 5, 8, null, 6];

実装の考え方

この問題を解くポイントは以下の3つです。

• 配列の各要素を順番に走査する
• 要素が配列であれば、その配列に対して再帰的に同じ処理を行い、結果を展開して追加する
• 配列以外の要素（falseやnullを含む）は、そのまま結果に追加する

コード例

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

const arr = [[1, 2, 3], [4, 5, [5, false, 6, [5, 8, null]]], [6]];
const flatten = function(){
    let res = [];
    for(let i = 0; i < this.length; i++){
        if(Array.isArray(this[i])){
            res.push(...this[i].flatten());
        }else{
            res.push(this[i]);
        };
    };
    return res;
};
Array.prototype.flatten = flatten;
console.log(arr.flatten());

コードの解説

このコードでは、flatten関数をArray.prototypeに追加することで、任意の配列からflatten()メソッドを呼び出せるようにしています。ループ内で各要素をチェックし、Array.isArray()によってその要素が配列かどうかを判定します。配列であればスプレッド構文（...）を使って再帰処理の結果を展開しながら追加し、そうでなければ要素をそのままresに追加します。この仕組みにより、どれだけ深くネストしていても配列全体を完全に平坦化できます。

なお、ES2019以降では組み込みメソッドのArray.prototype.flat(Infinity)でも同様のことが可能ですが、本記事のように自前で再帰を実装すれば、古い環境でも動作する汎用的なコードになります。

出力

コンソールには次の出力が表示されます −

[
    1, 2, 3,     4,
    5, 5, false, 6,
    5, 8, null,  6
]