JavaScript · Mittel
Privater Status mit Closures
Eine Closure entsteht, wenn eine innere Funktion auf Variablen aus ihrem äußeren Scope verweist, was die Kapselung privater Daten ermöglicht.
Snippet öffnen →Code-Bibliothek
JavaScript für Fortgeschrittene
Lies diese JavaScript-Snippets für Fortgeschrittene Zeile für Zeile — jedes kommt mit einer Erklärung, was der Code tut und warum.
JavaScript · Mittel
Optional Chaining und Nullish Coalescing
Optional Chaining (?.) bricht die Auswertung ab, wenn die Referenz 'nullish' ist, während Nullish Coalescing (??) einen Standardwert nur für null oder undefined liefert.
Snippet öffnen →JavaScript · Mittel
Objekt-Destructuring mit Aliasing und Standardwerten
Destructuring ermöglicht das Extrahieren von Objekteigenschaften in Variablen mit benutzerdefinierten Namen (Aliasing) und Standardwerten, falls die Eigenschaft fehlt.
Snippet öffnen →JavaScript · Mittel
Deklarative Datentransformation
Das Verketten von Funktionen höherer Ordnung wie filter und map ermöglicht die Verarbeitung von Sammlungen auf eine saubere, lesbare und deklarative Weise.
Snippet öffnen →JavaScript · Mittel
Resiliente parallele Asynchronität mit Promise.allSettled
Im Gegensatz zu Promise.all wartet Promise.allSettled darauf, dass alle Promises abgeschlossen sind, unabhängig davon, ob sie erfolgreich waren oder abgelehnt wurden.
Snippet öffnen →JavaScript · Mittel
Fortgeschrittene Verarbeitung mit Tagged Templates
Tagged Templates ermöglichen es, Template-Literale mit einer Funktion zu parsen. Das erste Argument enthält ein Array von String-Literalen, die weiteren Argumente sind die Werte der Ausdrücke. Dies…
Snippet öffnen →JavaScript · Mittel
Verwaltung privater Zustände mit WeakMap
WeakMap ist eine Sammlung von Schlüssel/Wert-Paaren, bei denen die Schlüssel Objekte sind und schwach referenziert werden. Dies ist ein Pattern zur Erstellung echter privater Zustände in JavaScript…
Snippet öffnen →JavaScript · Mittel
Sauberes Abbrechen von Async-Operationen mit AbortController
Das AbortController-Interface ermöglicht es, eine oder mehrere Web-Anfragen nach Bedarf abzubrechen. Dies ist wichtig, um das Entfernen von Komponenten in Frameworks zu handhaben oder Race Conditio…
Snippet öffnen →JavaScript · Mittel
Eigene Iterationslogik mit Generatoren
Generatoren sind Funktionen, die verlassen und später wieder betreten werden können. Ihr Kontext (Variablenbindungen) bleibt über die Wiedereintritte hinweg erhalten. Mit der '*'-Syntax und dem Sch…
Snippet öffnen →JavaScript · Mittel
Dynamische Datenvalidierung mit Proxies
Das Proxy-Objekt ermöglicht es, einen Wrapper für ein anderes Objekt zu erstellen, der grundlegende Operationen wie Eigenschaftssuche, Zuweisung und Aufzählung abfangen und neu definieren kann. In…
Snippet öffnen →JavaScript · Mittel
Metaprogrammierung mit Proxies
Das Proxy-Objekt ermöglicht es, eine Hülle um ein anderes Objekt zu erstellen, die grundlegende Operationen für dieses Objekt abfangen und neu definieren kann, wie z. B. Eigenschaftssuche, Zuweisun…
Snippet öffnen →JavaScript · Mittel
Implementierung benutzerdefinierter Iteratoren
Durch die Implementierung der Symbol.iterator-Methode wird ein Objekt 'iterierbar', wodurch es in for...of-Schleifen und mit dem Spread-Operator verwendet werden kann. Die Methode muss ein Objekt m…
Snippet öffnen →JavaScript · Mittel
Funktions-Currying
Currying ist ein Entwurfsmuster, bei dem eine Funktion mit mehreren Argumenten in eine Sequenz von verschachtelten Funktionen transformiert wird, die jeweils ein einzelnes Argument entgegennehmen.…
Snippet öffnen →JavaScript · Mittel
Die Kraft von 'finally' im Kontrollfluss
Der finally-Block wird immer ausgeführt, unabhängig davon, ob ein Fehler ausgelöst wurde oder eine Return-Anweisung in try/catch vorkam. Wichtig ist, dass ein Return in finally alle vorherigen Rück…
Snippet öffnen →JavaScript · Mittel
Tagged Template Literals
Tagged Templates ermöglichen es, Template-Literale mit einer Funktion zu verarbeiten. Das erste Argument ist ein Array von String-Literalen, und die restlichen Argumente sind die ausgewerteten Ausd…
Snippet öffnen →JavaScript · Mittel
Kapselung mit privaten Klassenfeldern
Private Klassenfelder (mit dem Präfix #) stellen sicher, dass auf interne Daten nicht von außerhalb der Klasseninstanz zugegriffen oder diese geändert werden können, was eine echte Kapselung in Jav…
Snippet öffnen →JavaScript · Mittel
Higher-Order Funktionen für Memoization
Memoization ist eine Optimierungstechnik, bei der die Ergebnisse teurer Funktionsaufrufe gespeichert werden, um das zwischengespeicherte Ergebnis zurückzugeben, wenn dieselben Eingaben erneut auftr…
Snippet öffnen →JavaScript · Mittel
Speicher-sichere Metadaten mit WeakMap
WeakMap ermöglicht es, Daten mit einem Objekt zu verknüpfen, ohne dessen Garbage Collection zu verhindern, was ideal für die Verwaltung von privatem Status oder Metadaten ist.
Snippet öffnen →JavaScript · Mittel
Robuste Async-Steuerung mit Promise.allSettled
Im Gegensatz zu Promise.all wartet Promise.allSettled darauf, dass alle Promises abgeschlossen sind (entweder erfüllt oder abgelehnt), was es ermöglicht, Teilerfolge in einer Reihe von Operationen…
Snippet öffnen →JavaScript · Mittel
Effiziente Eigenschafts-Initialisierung mit Nullish Assignment
Der Nullish Coalescing Assignment Operator (??=) weist nur dann einen Wert zu, wenn die Variable null oder undefined ist, was sicherer ist als die Verwendung von || für falsche Werte wie 0 oder lee…
Snippet öffnen →JavaScript · Mittel
Eigene Fehlerklassen
Das Erweitern der eingebauten Error-Klasse ermöglicht es dir, spezialisierte Fehlertypen für deine Anwendung zu erstellen. Dies macht die Fehlerbehandlung granularer, da du spezifische Fehlertypen…
Snippet öffnen →JavaScript · Mittel
Funktionale Pipe-Komposition
Pipe-Komposition ist ein funktionales Muster, bei dem die Ausgabe einer Funktion zur Eingabe der nächsten wird. Es ermöglicht den Aufbau komplexer Logik durch das Kombinieren einfacher, wiederverwe…
Snippet öffnen →JavaScript · Mittel
Objekt-Destrukturierung mit Aliasing und Standards
Destrukturierung kann verschachtelte Eigenschaften extrahieren und sie in einem Schritt neuen Variablennamen zuweisen (Aliasing). Du kannst auch Standardwerte angeben, die verwendet werden, wenn ei…
Snippet öffnen →JavaScript · Mittel
Performance-Optimierung mit Set
Das Set-Objekt ist eine Sammlung eindeutiger Werte. Die Verwendung eines Sets für Suchvorgänge ist erheblich schneller als bei einem Array (O(1) gegenüber O(n) Komplexität) und bietet eine elegante…
Snippet öffnen →JavaScript · Mittel
Objekt-Immutabilität mit Spread und Rest
Die Wahrung der Immutabilität ist entscheidend für ein vorhersehbares State-Management. Die Kombination aus Rest-Syntax zum Ausschließen von Eigenschaften und Spread-Syntax zum Zusammenführen neuer…
Snippet öffnen →JavaScript · Mittel
Objekt-Mutierbarkeit steuern mit Object.seal()
Object.seal() verhindert, dass neue Eigenschaften hinzugefügt oder bestehende gelöscht werden, erlaubt aber die Änderung bestehender Werte. Dies ist ideal für feste Konfigurationsobjekte, bei denen…
Snippet öffnen →JavaScript · Mittel
Daten gruppieren mit Array.prototype.reduce()
Die reduce-Methode ist ein vielseitiges Werkzeug, um ein Array in ein einzelnes Objekt zu transformieren. Durch die Initialisierung mit einem leeren Objekt können wir die Liste durchlaufen und dyna…
Snippet öffnen →JavaScript · Mittel
Zustand kapseln mit Closures
Closures ermöglichen es einer Funktion, sich an die Umgebung zu 'erinnern', in der sie erstellt wurde. Hier ist die Variable 'count' von außen unzugänglich, was ein Muster für privaten Zustand ohne…
Snippet öffnen →JavaScript · Mittel
Race Conditions und Timeouts mit Promise.race()
Promise.race() gibt ein Versprechen zurück, das abgeschlossen ist, sobald eines der Eingabe-Versprechen abgeschlossen ist (entweder aufgelöst oder abgelehnt). Dies wird häufig verwendet, um Timeout…
Snippet öffnen →JavaScript · Mittel
Kontextbezogenes Debugging mit Error Cause
Die 'cause'-Eigenschaft im Error-Konstruktor ermöglicht es, einen ursprünglichen Fehler in einen neuen zu verpacken. Dies bewahrt den Stack-Trace und den Kontext der Fehlerursache, während gleichze…
Snippet öffnen →