Funktionen, die JavaScript-Entwickler 2025 unbedingt kennen sollten

• JavaScript entwickelt sich auch 2025 weiter, und manche Funktionen sind zwar wenig bekannt, aber äußerst nützlich
• Die neuen Iterator-Helper-Methoden arbeiten bei großen Datentransformationen deutlich speichereffizienter
• Zugriff vom Ende eines Arrays mit at(), die einfache Nutzung von Promise.withResolvers() und structuredClone() für tiefe Kopien
• Mengenoperationen für Set, Tag-Funktionen für Template-Strings und die Verwendung von WeakMap/WeakSet werden von vielen Entwicklern noch immer übersehen

Iterator-Helper-Methoden

• Beim Chaining wie mit arr.filter().map() werden in jedem Schritt neue Arrays erzeugt, was ineffizient ist
• Das lässt sich mit iteratorbasiertem Chaining wie arr.values().drop(10).take(10).map(...).toArray() verbessern
• Wichtige Methoden:
  • drop(): die ersten n Elemente überspringen
  • take(): nur die ersten n Elemente übernehmen
  • filter(), map(), flatMap(): funktionieren ähnlich wie die Array-Methoden
  • reduce(), some(), every(), find(): unterstützen Bedingungsprüfungen und akkumulative Berechnungen
  • toArray(): in ein finales Array umwandeln
• Safari unterstützt dies seit dem 31. März 2025, allerdings noch nicht in allen Browsern

Array at()

• arr.at(n) ist ähnlich wie arr[n], erlaubt aber negative Indizierung für den Zugriff vom Ende her
• Beispiel: [10, 20, 30].at(-1) → 30
• So lässt sich ohne umständliche Konstruktionen wie arr[arr.length - 1] auf das letzte Element zugreifen

Promise.withResolvers()

• Bisheriger Ansatz: Bei new Promise((resolve, reject) => { ... }) wurden resolve/reject außerhalb gespeichert
• Jetzt geht es mit const { promise, resolve, reject } = Promise.withResolvers() knapp und intuitiv

Einsatz von Callbacks in String.replace()

• Das zweite Argument von replace() und replaceAll() akzeptiert nicht nur Strings, sondern auch Callback-Funktionen
• Beispiel: "X, X, X".replaceAll("X", (match, i) => match + i) → "X0, X3, X6"
• So sind verschiedene Ersetzungen in einem Durchgang möglich → effizient in Bezug auf Performance und Speicher

Variablen tauschen (Swap)

• Bisheriger Ansatz: Verwendung einer temp-Variable
• Kürzere Variante: [a, b] = [b, a] zum Tauschen per Array-Destrukturierung

structuredClone()

• Unterstützt genauere und effizientere tiefe Kopien als JSON.stringify() + JSON.parse()
• Vorteile:
  • unterstützt auch NaN, undefined, bigint usw.
  • zyklische Referenzen lassen sich sicher kopieren
  • bei großen Objekten effizienter bei Speicherverbrauch und Geschwindigkeit

Tagged Template Literals

• Template-Strings lassen sich durch bestimmte Funktionen parsen
• Nützlich für dynamische Nachbearbeitung von Strings, etwa HTML-Escaping
• Beispiel:
  Mit der Tag-Funktion escapeHtml wird <br> ${'<br>'} zu <br> <br>

WeakMap / WeakSet

• Ähnlich wie normale Map und Set, aber:
  • nur Objekte sind als Schlüssel erlaubt (keine primitiven Werte)
  • werden automatisch entfernt, wenn sie Ziel der Garbage Collection werden
• Geeignet bei möglichen zyklischen Referenzen oder zum Speichern von Objekt-Metadaten ohne Seiteneffekte

Unterstützung für Mengenoperationen bei Set

Für Set-Objekte in JavaScript wurden verschiedene logische Operationen neu hinzugefügt:

• difference(): Differenzmenge (A - B)
• intersection(): Schnittmenge (A ∩ B)
• union(): Vereinigungsmenge (A ∪ B)
• symmetricDifference(): symmetrische Differenz (A △ B)
• isDisjointFrom(): ob keine gemeinsamen Elemente vorhanden sind
• isSubsetOf(): ob es sich um eine Teilmenge handelt
• isSupersetOf(): ob es sich um eine Obermenge handelt

[wfedev]

Es scheint, dass das Problem behoben wurde, bei dem beim Parsen von Literalen sogar Variablen als String ausgegeben wurden. Danke fürs Teilen.

[pompapa]

Beispiel: "X, X, X".replaceAll("X", (match, i) => match + i) → "X0, X1, X2"

Das Beispiel ist falsch. i enthält die Position des Treffers.
Daher ist das Ergebnis "X0, X3, X6".

[xguru]

Oh, stimmt. Die KI hat das Beispiel falsch erzeugt. Ich habe es korrigiert. Danke für den scharfsinnigen Hinweis!

[click]

values erinnert ein wenig an die Java Stream API, daher habe ich es verglichen: Wenn das Array klein ist, ist Filtern ohne values schneller. Da es iteratorbasiert ist, dürfte sich der Effekt ergeben, dass die Variante mit einem zusätzlichen Durchlauf über values schneller wird, je länger die Chaining-Kette ist. Den Benchmark finden Sie unter https://jsperf.app/dixutu.