jsは配列の平坦化を実装します

配列をフラット化する方法

配列のフラット化とは何ですか?

配列の平坦化: 多次元配列を 1 次元配列に変換することを指します。

例: 次の配列をフラット化します。

const arr = [1, [2, 3, [4, 5]]] // ---> [ 1, 2, 3, 4, 5 ]

1.flat() の使用

flat() メソッドは ES10 で提案されました。指定された深さで配列を再帰的に走査し、走査されたサブ配列の要素とすべての要素を新しい配列にマージして返します。（flat は「水平、平ら」という意味です）

const result1 = arr.flat(Infinity) // 深さを無限に指定します console.log(result1) // [ 1, 2, 3, 4, 5 ]
const result2 = arr.flat(1) // 深さを1に指定
console.log(結果2) // [ 1, 2, 3, [ 4, 5 ] ]
const result3 = arr.flat(2) // 深さを2に指定します
console.log(結果3) // [ 1, 2, 3, 4, 5 ]

2. 正規表現を使用する

以下の方法で取得された配列要素は文字列に変換されますが、これは推奨されません。

const result1 = JSON.stringify(arr).replace(/\[|\]/g, '').split(',')
console.log(result1) // [ '1', '2', '3', '4', '5' ] 配列要素は文字列に変換されます

上記の方法を最適化します。

const result2 = JSON.parse('[' + JSON.stringify(arr).replace(/\[|\]/g, '') + ']')
console.log(結果2) // [ 1, 2, 3, 4, 5 ]

3.reduce()+concat()を使用する

Reduce を使用して配列の現在の値と前の値を取得し、現在の値が配列であるかどうかを判断し、初期値を [] に設定してから、concat を使用して配列を結合します。

Reduce() メソッド: 配列内の各要素に対して指定したリデューサー関数を (昇順で) 実行し、結果を 1 つの戻り値にまとめます。
concat() メソッド: 2 つ以上の配列を結合するために使用されます。このメソッドは既存の配列を変更せず、新しい配列を返します。

関数flatten(arr){
  戻り値 arr.reduce((pre, current) => {
    pre.concat(Array.isArray(current) ? flatten(current) : current) を返します
  }, [])
}
const 結果 = flatten(arr)
console.log(結果) // [ 1, 2, 3, 4, 5 ]

4. 関数の再帰を使用する

配列をループし、配列要素が含まれている場合は再帰的に処理し、最後に配列を 1 次元配列に変換します。

定数結果 = []
関数exec(arr) {
  arr.forEach(アイテム => {
    Array.isArray(item) の場合 {
      実行(アイテム)
    } それ以外 {
      結果.push(アイテム)
    }
  })
}
実行(arr)
console.log(結果) // [ 1, 2, 3, 4, 5 ]

5. スプレッド演算子 + concat() を使用する

ES6 で導入された新しいスプレッド演算子を使用すると、配列の次元を (一度に 1 次元ずつ) 削減し、ループして配列が含まれているかどうかを判断し、連結マージを実行できます。

some() メソッド: 配列内に、指定された関数テストに合格する要素が少なくとも 1 つあるかどうかをテストします (ブール値を返します)。

関数flatten(arr){
  (arr.some(item => Array.isArray(item))) の間 {
    arr = [].concat(...arr)
  }
  リターン
}
const 結果 = flatten(arr)
console.log(結果) // [ 1, 2, 3, 4, 5 ]