配列のネストを平坦化 - flat
《 初回公開：2023/10/19 , 最終更新：未 》
flatメソッドはネストした配列(要素に配列を含む配列)を文字どうりフラット(平坦)にするメソッド。
説明よりサンプルコードを示した方がわかりやすいと思うので。
// ネストした配列
const array = ["a", "b", ["ca", "cb", "ca"]];
const flattenedArray = array.flat();
console.log(flattenedArray); // ['a', 'b', 'ca', 'cb', 'ca']
flatメソッドは非破壊的メソッド、つまり元の配列を変化させる事は無い、新たな配列を生成してそれを返す。
flatメソッドと同等の機能はreduceやconcat等のメソッドを組み合わせて実装する事もできる。
- 構文
- array.flat([depth])
- 引数
-
- depth (オプション)
- フラット化の深さを指定、デフォルト値は 1、指定した深さに応じて、ネストされた配列を再帰的にフラット化する。
より深くネストした配列を例にメソッドの引数をいろいろ指定してみると。
// 3階層のより深くネストした配列
const array = ["a", "b", ["c", ["ca", "cb"]], ["d", ["da", ["daa", "dab"]]]];
// 引数を指定しない場合、1階層までしかフラット化してくれない。
console.log(JSON.stringify(array.flat())); // ["a","b","c",["ca","cb"],"d",["da",["daa","dab"]]]
// 1階層までしかフラット化の結果は引数を指定しない場合と同じ
console.log(JSON.stringify(array.flat(1))); // ["a","b","c",["ca","cb"],"d",["da",["daa","dab"]]]
// 2階層までのフラット化
console.log(JSON.stringify(array.flat(2))); // ["a","b","c","ca","cb","d","da",["daa","dab"]]
// 3階層までのフラット化で完全なフラットに
console.log(JSON.stringify(array.flat(3))); // ["a","b","c","ca","cb","d","da","daa","dab"]
// これ以上引数を大きくしても3階層までのフラット化と同じ
console.log(JSON.stringify(array.flat(4))); // ["a","b","c","ca","cb","d","da","daa","dab"]
// 引数に0やマイナスの値をしてしても何もしない
console.log(JSON.stringify(array.flat(0))); // ["a","b",["c",["ca","cb"]],["d",["da",["daa","dab"]]]]
console.log(JSON.stringify(array.flat(-3)));// ["a","b",["c",["ca","cb"]],["d",["da",["daa","dab"]]]]
flatメソッドは配列内の空のスロットを削除する。
const array = ["a", , ["c", ["ca", ,"cc"]]];
console.log(array.flat(2)); // ['a', 'c', 'ca', 'cc']