suchen
HeimWeb-FrontendFront-End-Fragen und AntwortenSo konvertieren Sie ein zweidimensionales ES6-Array in ein eindimensionales Array

In es6 können Sie die Methode flat() verwenden, um ein zweidimensionales Array in ein eindimensionales Array umzuwandeln. Diese Methode „glättet“ standardmäßig eine Ebene von Arrays. Sie können Parameter verwenden, um die Anzahl der Ebenen festzulegen Diese Methode gibt nur ein neues Array zurück, das das ursprüngliche Array nicht ändert, und die Syntax lautet „zweidimensionales Array.flat ()“.

So konvertieren Sie ein zweidimensionales ES6-Array in ein eindimensionales Array

Die Betriebsumgebung dieses Tutorials: Windows 10-System, ECMAScript Version 6.0, Dell G3-Computer.

So konvertieren Sie ein zweidimensionales Array von es6

Methode: flat(); akzeptiert die Parameter 2, 3, 4..., Infinity;

1 -dimensionales Array- -->Eindimensionales Array. Diese Methode gibt ein neues Array zurück und hat keine Auswirkungen auf die Originaldaten.

[1,2,[2,3],[2,2]].flat()
//[1, 2, 2, 3, 2, 2]

2.flat() „glättet“ standardmäßig nur eine Ebene, und der Standardwert ist 1. Wenn Sie ein mehrschichtiges verschachteltes Array „glätten“ möchten, können Sie den Parameter der flat()-Methode als schreiben eine Ganzzahl, die angibt, dass Sie die Ebenen reduzieren möchten.

[1, 2, [3, [4, 5]]].flat()
// [1, 2, 3, [4, 5]]
[1, 2, [3, [4, 5]]].flat(2)
// [1, 2, 3, 4, 5]

3. Wenn Sie es unabhängig von der Anzahl der Verschachtelungsebenen in ein eindimensionales Array konvertieren möchten, können Sie das Schlüsselwort Infinity als Parameter verwenden.

Wenn es Lücken im ursprünglichen Array gibt, überspringt die flat()-Methode die Lücken.

[1, [2, [3,4]]].flat(Infinity)
// [1, 2, 3, 4]
[1, 2, , 4, 5].flat()
// [1, 2, 4, 5]

Beispiele sind wie folgt:

        const a = [1, 2, 3, 4, 3];
 
        const b = [3, 4, [5, 6]];
 
        const c = [3, 4, [5, 6, [7, 8]]];
 
        // 不传默认是二维数组降一维数组
        console.log(a.concat(b).flat());  // 打印为[1, 2, 3, 4, 3, 3, 4, 5, 6]
 
        console.log(a.concat(c).flat(3))  // 打印为[1, 2, 3, 4, 3, 3, 4, 5, 6, 7, 8]
 
        // 如果数组嵌套太过复杂可直接传值Infinity
        console.log(a.concat(c).flat(Infinity)) // 打印为[1, 2, 3, 4, 3, 3, 4, 5, 6, 7, 8]

[Verwandte Empfehlungen:

Javascript-Video-Tutorial

, Web-Frontend]

Das obige ist der detaillierte Inhalt vonSo konvertieren Sie ein zweidimensionales ES6-Array in ein eindimensionales Array. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
So verwenden Sie Usestate () Haken in funktionellen React -KomponentenSo verwenden Sie Usestate () Haken in funktionellen React -KomponentenApr 30, 2025 am 12:25 AM

Mit Usestate können Status in Funktionskomponenten hinzugefügt werden, da es Hindernisse zwischen Klassenkomponenten und Funktionskomponenten beseitigt, wodurch letztere gleichermaßen leistungsfähig sind. Zu den Schritten zur Verwendung von Usestate gehören: 1) Importieren des Usestate -Hooks, 2) Initialisierung des Zustands, 3) mit dem Status und Aktualisierung der Funktion.

Reacts vieworientierter Natur: Verwaltung des komplexen AnwendungszustandsReacts vieworientierter Natur: Verwaltung des komplexen AnwendungszustandsApr 30, 2025 am 12:25 AM

React's View Focus verwaltet den komplexen Anwendungszustand durch Einführung zusätzlicher Tools und Muster. 1) React selbst übernimmt kein staatliches Management und konzentriert sich auf die Zuordnung von Zuständen auf Ansichten. 2) Komplexe Anwendungen müssen Redux, MOBX oder Kontextableiter verwenden, um Zustände zu entkoppeln, wodurch das Management strukturierter und vorhersehbarer wird.

Integration von Reaktionen in andere Bibliotheken und FrameworksIntegration von Reaktionen in andere Bibliotheken und FrameworksApr 30, 2025 am 12:24 AM

Integration von Witherlibrary und FrameWorkscanenhanceApplicationCapabilities ByleveragingDifferenttools'Strengths.BenefitsincludestreamLinedStatemanagement mit

Überlegungen zur Zugänglichkeit bei React: Aufbau integrativer UISÜberlegungen zur Zugänglichkeit bei React: Aufbau integrativer UISApr 30, 2025 am 12:21 AM

TomakerActApplicationsmoreAcessible, folgt Thesesteps: 1) useemantichtmlelementsInjsxforbetternAvigationAndseo.2) ImplementfocusmanagementForKeyboardusers, insbesondere inmodals.3) utilizereActhooks -ähnlich

SEO-Herausforderungen mit React: Behandte der kundenseitigen Rendering-ProblemeSEO-Herausforderungen mit React: Behandte der kundenseitigen Rendering-ProblemeApr 30, 2025 am 12:19 AM

SEO für React-Anwendungen können mit folgenden Methoden gelöst werden: 1. Implementieren von Server-Side-Rendering (SSR), z. B. die Verwendung von Next.js; 2. Verwenden Sie dynamisches Rendering, wie z. 3. Optimieren Sie die Anwendungsleistung und verwenden Sie den Leuchtturm für die Leistungsprüfung.

Die Vorteile der starken Gemeinschaft und des Ökosystems von React von ReactDie Vorteile der starken Gemeinschaft und des Ökosystems von React von ReactApr 29, 2025 am 12:46 AM

React'sStrongCommunityAndemoFfernumousBenefits: 1) unmittelbarer AspekteStosolutions -Throughplatformslikestackoverflowandgithub;

Reagieren Sie nativ für die mobile Entwicklung: Aufbau von plattformübergreifenden AppsReagieren Sie nativ für die mobile Entwicklung: Aufbau von plattformübergreifenden AppsApr 29, 2025 am 12:43 AM

ReactnativeIsChosenFormoBileDententwicklungsentwicklung

Status korrekt mit usemESTATE () in React aktualisierenStatus korrekt mit usemESTATE () in React aktualisierenApr 29, 2025 am 12:42 AM

Richtige Aktualisierung von usestate () in reagieren erfordert das Verständnis der Details des Staatsmanagements. 1) Verwenden Sie funktionale Updates, um asynchrone Updates zu verarbeiten. 2) Erstellen Sie ein neues Zustandsobjekt oder ein neues Array, um zu vermeiden, dass der Status direkt geändert wird. 3) Verwenden Sie ein einzelnes Zustandsobjekt, um komplexe Formulare zu verwalten. 4) Verwenden Sie die Anti-Shake-Technologie, um die Leistung zu optimieren. Diese Methoden können Entwicklern helfen, häufige Probleme zu vermeiden und robustere React -Anwendungen zu schreiben.

See all articles

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Herunterladen der Mac-Version des Atom-Editors

Herunterladen der Mac-Version des Atom-Editors

Der beliebteste Open-Source-Editor

EditPlus chinesische Crack-Version

EditPlus chinesische Crack-Version

Geringe Größe, Syntaxhervorhebung, unterstützt keine Code-Eingabeaufforderungsfunktion

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Sicherer Prüfungsbrowser

Sicherer Prüfungsbrowser

Safe Exam Browser ist eine sichere Browserumgebung für die sichere Teilnahme an Online-Prüfungen. Diese Software verwandelt jeden Computer in einen sicheren Arbeitsplatz. Es kontrolliert den Zugriff auf alle Dienstprogramme und verhindert, dass Schüler nicht autorisierte Ressourcen nutzen.

SAP NetWeaver Server-Adapter für Eclipse

SAP NetWeaver Server-Adapter für Eclipse

Integrieren Sie Eclipse mit dem SAP NetWeaver-Anwendungsserver.