Array : méthode flat()

Baseline Large disponibilité

Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis janvier 2020.

La méthode flat() des instances de Array crée un nouveau tableau dans lequel tous les éléments des sous-tableaux sont concaténés récursivement jusqu'à la profondeur définie.

Dans cet article

Exemple interactif

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

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

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

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

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

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

Syntaxe

js
flat()
flat(depth)

Paramètres

depth Facultatif

Le niveau de profondeur qui définit jusqu'à quel point une structure de tableaux imbriqués doit être aplatie. La valeur par défaut est 1.

Valeur de retour

Un nouveau tableau avec les éléments des sous-tableaux concaténés.

Description

La méthode flat() est une méthode de copie. Elle ne modifie pas this mais renvoie une copie superficielle qui contient les mêmes éléments que ceux du tableau d'origine.

La méthode flat() retire les cases vides si le tableau à aplatir est creux. Par exemple, si depth vaut 1, les cases vides du tableau racine et du premier niveau des tableaux imbriqués sont ignorées, mais les cases vides des niveaux plus profonds sont conservées avec les tableaux eux-mêmes.

La méthode flat() est générique. Elle attend seulement que la valeur de this possède une propriété length et des propriétés à clés entières. Cependant, ses éléments doivent être des tableaux pour être aplatis.

Exemples

Aplatir des tableaux imbriqués

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

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

const 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, [9, 10]]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

Utiliser flat() sur des tableaux creux

La méthode flat() retire les cases vides dans les tableaux :

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

const array = [1, , 3, ["a", , "c"]];
console.log(array.flat()); // [ 1, 3, "a", "c" ]

const array2 = [1, , 3, undefined, ["a", , ["d", , "e"]], null];
console.log(array2.flat()); // [ 1, 3, undefined, "a", ["d", vide, "e"], null ]
console.log(array2.flat(2)); // [ 1, 3, undefined, "a", "d", "e", null ]

Utiliser flat() sur des objets qui ne sont pas des tableaux

La méthode flat() lit la propriété length de this puis accède à chaque propriété dont la clé est un entier non négatif inférieur à length. Si l'élément n'est pas un tableau, il est ajouté directement au résultat. Si l'élément est un tableau, il est aplati selon le paramètre depth.

js
const objetSimilaireTableau = {
  length: 3,
  0: [1, 2],
  // Les objets qui ressemblent à des tableaux ne sont pas aplatis
  1: { length: 2, 0: 3, 1: 4 },
  2: 5,
  3: 3, // ignoré par flat() car length vaut 3
};
console.log(Array.prototype.flat.call(objetSimilaireTableau));
// [ 1, 2, { '0': 3, '1': 4, length: 2 }, 5 ]