Nel mondo JavaScript abbiamo spesso a che fare con API. Nel migliore dei casi, queste sono scritte da noi, quindi l'output sarà codificato in modo tale da poter essere rappresentato ed elaborato facilmente una volta che il browser avrà ricevuto il dato. Tuttavia non sempre é così: la volontà, di alcuni servizi, di generalizzare il formato dell'informazione fa sì che essa possa arrivare in costrutti non congeniali al nostro stile di programmazione.
Uno di questi è una struttura che potremmo definire come un array di array di array.

const a = [1, 2, 3, [4, 5, [6, 7]]]

Per poter rimuovere gli array sottostanti, abbiamo la possibilità di utilizzare la funzione flat, al cui interno definiamo la profondità di lavoro, cioè quanti livelli di array dovrà rimuovere. Se non verrà specificato nulla, il valore di default sarà 1.

console.log(a.flat())
//  [1, 2, 3, 4, 5, [6, 7]]

console.log(a.flat(2))
//  [1, 2, 3, 4, 5, 6, 7]

Ma non è tutto! Se oltre all'operazione eseguita da flat, volessimo anche eseguire una modifica al dato, dovremo utilizzare flatMap.

Fornendo come parametro una funzione, flatMap eseguirà un map e successivamente una flat(1). Ne consegue che, se prendiamo in esame la funzione seguente, l'operazione verrà eseguita solo sugli elementi del primo livello dell'array e non sugli elementi che verranno portati al primo livello.

console.log( a.flatMap(el=>{ return typeof(el) === "number" ? el +1 : el}) )

// [2, 3, 4, 4, 5, [6, 7]]

// concatenazione flat per restituire un array unico
console.log( a.flatMap(el=>{ return typeof(el) === "number" ? el +1 : el}).flat() )

// [2, 3, 4, 4, 5, 6, 7]