Dies ist eine experimentelle Technologie
Da diese Technologie noch nicht definitiv implementiert wurde, sollte die Browserkompatibilität beachtet werden. Es ist auch möglich, dass die Syntax in einer späteren Spezifikation noch geändert wird.

Die flat() Methode erstellt rekursiv ein neues Array mit allen Elementen von Unterarrays bis zu einer spezifizierten Tiefe.

Syntax

var newArray = arr.flat(depth);

Parameter

depth Optional
Das Tiefenlevel, welches angibt, bis zu welcher Tiefe die Arraystruktur abgeflacht werden soll. Der Standardwert ist 1.

Rückgabewert

Ein neues Array, welches die Elemente der Unterarrays enthält.

Beispiele

Abflachen von geschachtelten Arrays

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]

Abflachen und Löcher in Arrays

Die flat Methode entfernt leere Plätze in Arrays:

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

Alternative

reduce und concat

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

// Um ein Array um eine Ebene zu glätten.
arr1.reduce((acc, val) => acc.concat(val), []);
// [1, 2, 3, 4]

// Um mehrere Ebenen zu glätten muss reduce und concat rekursiv eingesetzt werden.

var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];

function flattenDeep(arr1) {
   return arr1.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []);
}
flattenDeep(arr1);

// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

Spezifikationen

Spezifikation Status Kommentar
Array.prototype.flat proposal Candidate (3)  

Browserkompatibilität

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidEdge MobileFirefox für AndroidOpera für AndroidiOS SafariSamsung InternetNode.js
Grundlegende Unterstützung
Experimentell
Chrome Vollständige Unterstützung 69Edge Keine Unterstützung NeinFirefox Vollständige Unterstützung 62IE Keine Unterstützung NeinOpera Vollständige Unterstützung 56Safari Vollständige Unterstützung 12WebView Android Vollständige Unterstützung 69Chrome Android Vollständige Unterstützung 69Edge Mobile Keine Unterstützung NeinFirefox Android Vollständige Unterstützung 62Opera Android Vollständige Unterstützung 56Safari iOS Vollständige Unterstützung 12Samsung Internet Android Keine Unterstützung Neinnodejs Keine Unterstützung Nein

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Keine Unterstützung  
Keine Unterstützung
Experimentell. Das Verhalten kann sich zukünftig ändern.
Experimentell. Das Verhalten kann sich zukünftig ändern.

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

Mitwirkende an dieser Seite: fscholz, schlagi123
Zuletzt aktualisiert von: schlagi123,