JS で配列をフラット化する 5 つの方法

1.通常の再帰の考え方は理解しやすく、forループによって層ごと、要素ごとに平坦化し、現在の要素が配列の場合、それを再帰的に処理し、再帰処理の結果を結果の配列につなぎ合わせます。

let arr = [1, [2, [3, 4, 5]]];
function flatten(arr) {
  let result = [];
  for(let i = 0; i < arr.length; i++) {
    // 当前元素是一个数组，对其进行递归展平
    if(Array.isArray(arr[i])) {
      // 递归展平结果拼接到结果数组
      result = result.concat(flatten(arr[i]));
    } 
    // 否则直接加入结果数组
    else {
      result.push(arr[i]);
    }
  }
  return result;
}
console.log(flatten(a));  //  [1, 2, 3, 4，5]

2 つ目は、配列における非常に強力なメソッドreduceであり、配列における関数型プログラミングでもあります。JSJSAPI

上記の再帰的実装の鍵は、配列の各項目を処理し、配列に遭遇したときにそれを再帰的に処理することです。ループと結果配列が必要なので、次を使用してコードを簡素化できますreduce。

let arr = [1, [2, [3, 4]]];
function flatten(arr) {
    return arr.reduce(function(pre, cur){
        return pre.concat(Array.isArray(cur) ? flatten(cur) : cur)
    }, [])
}
console.log(flatten(arr));//  [1, 2, 3, 4，5]

3. スプレッド演算子はES6配列の新しい機能の 1 つです。これを使用して配列を操作すると、配列の最初の層を直接拡張できます。この機能を使用すると、再帰を使用せずに配列の平坦化を実現できます。

let arr = [1, [2, [3, 4]]];
function flatten(arr) {
    while (arr.some(i => Array.isArray(i))) {
        arr = [].concat(...arr);
    }
    return arr;
}
console.log(flatten(arr)); //  [1, 2, 3, 4，5]

4.正規化の実装では、まず配列を文字列式に変換します。ここでは、JSON.stringify メソッドを使用して、配列を括弧で囲まれ、カンマで区切られた文字列に変換します。se メソッドは、配列オブジェクトに解析されます"[1, [2, [3, [4, 5]]], 6]"。

let arr = [1, [2, [3, [4, 5]]], 6];
function flatten(arr) {
  let str = JSON.stringify(arr);
  str = str.replace(/(\[|\])/g, '');
  // 拼接最外层，变成JSON能解析的格式
  str = '[' + str + ']';
  return JSON.parse(str); 
}
console.log(flatten(arr)); //  [1, 2, 3, 4，5]

5.Array.prototype.flatこれはES6新しく追加された配列メソッドであり、その機能は配列を平坦化し、渡されたパラメータに従って拡張のレベルを決定することです。

let arr = [1, [2, [3, 4]]];
function flatten(arr) {
  return arr.flat(Infinity);
}
console.log(flatten(arr)); //  [1, 2, 3, 4，5]

上記の方法は、あらゆるタイプの配列をフラット化することもできます。私はそれを試してみましたが、直接使用できます。

JS で配列をフラット化する 5 つの方法

おすすめ