Array.prototype.flat()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

Experimental: Esta é uma tecnologia experimental
Verifique a tabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.

O método flat() cria um novo array com todos elementos sub-arrays concatenados nele de forma recursiva até a profundidade especificada.

Experimente

const arr1 = [0, 1, 2, [3, 4]];

console.log(arr1.flat());
// expected output: Array [0, 1, 2, 3, 4]

const arr2 = [0, 1, [2, [3, [4, 5]]]];

console.log(arr2.flat());
// expected output: Array [0, 1, 2, Array [3, Array [4, 5]]]

console.log(arr2.flat(2));
// expected output: Array [0, 1, 2, 3, Array [4, 5]]

console.log(arr2.flat(Infinity));
// expected output: Array [0, 1, 2, 3, 4, 5]

Sintaxe

js
flat();
flat(depth);

Parâmetros

depth Optional

O nível de profundidade especifíca o quão profundo um array aninhando deve ser achatado. O padrão é 1.

Retorno

Um novo array com os elementos sub-array concatenados nele.

Exemplos

Achatando arrays aninhados

js
var arr1 = [1, 2, [3, 4]];
arr1.flat();
// [1, 2, 3, 4]

var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]

const arr4 = [1, 2, [3, 4, [5, 6, [7, 8]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8]

Achatando e buracos em array

o método flat remove espaços vazios do array:

js
var arr5 = [1, 2, , 4, 5];
arr5.flat();
// [1, 2, 4, 5]

Alternativa

reduce e concat

js
var arr = [1, 2, [3, 4]];

// Achatar array de nível único
arr.flat();
// É equivalente à
arr.reduce((acc, val) => acc.concat(val), []);
// [1, 2, 3, 4]

// Ou com sintaxe de decomposição
const flattened = (arr) => [].concat(...arr);

reduce + concat + isArray + recursividade

js
var arr = [1, 2, [3, 4, [5, 6]]];

// Para achatamentos mais profundos, use recursividade com reduce e concat
function flatDeep(arr, d = 1) {
  return d > 0
    ? arr.reduce(
        (acc, val) =>
          acc.concat(Array.isArray(val) ? flatDeep(val, d - 1) : val),
        [],
      )
    : arr.slice();
}

flatDeep(arr, Infinity);
// [1, 2, 3, 4, 5, 6]

Especificações

Especificação Status Comentários
Array.prototype.flat proposal Draft

Compatibilidade com navegadores

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
flat

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Veja Também