`Array.prototype.flat` e `Array.prototype.flatMap`
Array.prototype.flat
O array neste exemplo tem vários níveis de profundidade: contém um array que, por sua vez, contém outro array.
const array = [1, [2, [3]]];
// ^^^^^^^^^^^^^ array externo
// ^^^^^^^^ array interno
// ^^^ array mais interno
Array#flat retorna uma versão achatada de um array fornecido.
array.flat();
// → [1, 2, [3]]
// …é equivalente a:
array.flat(1);
// → [1, 2, [3]]
A profundidade padrão é 1, mas você pode passar qualquer número para achatar recursivamente até essa profundidade. Para continuar achatando recursivamente até o resultado não conter mais arrays aninhados, passamos Infinity.
// Achatar recursivamente até o array não conter mais arrays aninhados:
array.flat(Infinity);
// → [1, 2, 3]
Por que esse método é chamado de Array.prototype.flat e não Array.prototype.flatten? Leia nosso artigo sobre #SmooshGate para descobrir!
Array.prototype.flatMap
Aqui está outro exemplo. Temos uma função duplicate que recebe um valor e retorna um array que contém esse valor duas vezes. Se aplicarmos duplicate a cada valor de um array, terminamos com um array aninhado.
const duplicate = (x) => [x, x];
[2, 3, 4].map(duplicate);
// → [[2, 2], [3, 3], [4, 4]]
Você pode então chamar flat no resultado para achatar o array:
[2, 3, 4].map(duplicate).flat(); // 🐌
// → [2, 2, 3, 3, 4, 4]
Como esse padrão é tão comum na programação funcional, agora há um método dedicado flatMap para ele.
[2, 3, 4].flatMap(duplicate); // 🚀
// → [2, 2, 3, 3, 4, 4]
flatMap é um pouco mais eficiente em comparação a fazer um map seguido de um flat separadamente.
Interessado em casos de uso para flatMap? Confira a explicação de Axel Rauschmayer.